:root{color-scheme:light;--bg:#f6f1e5;--paper:#fffaf0;--text:#25251f;--secondary:#656353;--tertiary:#777463;--line:#25251f33;--line-2:#25251f66;--row:#eee7d6;--control:#e9e1cd;--control-2:#ddd3bb;--logo:#efc34b;--accent:#de6c50;--link:#954029;--font:'Trebuchet MS',Arial,sans-serif;--display:Georgia,'Times New Roman',serif;--mono:ui-monospace,'Cascadia Code',Consolas,monospace;--morph:cubic-bezier(.2,.85,.2,1);--gutter:clamp(22px,5vw,76px)}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 var(--font);-webkit-font-smoothing:antialiased;overflow-x:clip}body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:1000;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' opacity='.7' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
a{color:inherit}button,input,textarea{font:inherit;color:inherit}button{cursor:pointer;background:none;border:0;padding:0}button,a,input,textarea{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid var(--accent);outline-offset:5px}button:disabled{cursor:default}button,a{touch-action:manipulation}::selection{background:var(--logo);color:var(--text)}[hidden]{display:none!important}.skip-link{position:fixed;z-index:2000;top:8px;left:8px;padding:10px;background:var(--paper);transform:translateY(-160%)}.skip-link:focus{transform:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.eyebrow,.label{display:inline-block;font:700 10px/1.5 var(--font);letter-spacing:.15em;text-transform:uppercase}.label{color:var(--secondary);letter-spacing:.1em}.count{font:11px var(--mono);color:var(--secondary)}.icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle;flex-shrink:0}h1,h2,h3,p{overflow-wrap:break-word}h1,h2{font-family:var(--display);font-weight:700;letter-spacing:-.065em}h2{font-size:clamp(36px,4.6vw,64px);line-height:1.05;margin:20px 0 24px}h1 em,h2 em{font-style:italic;font-weight:400}p{color:var(--secondary)}.page{max-width:1300px;margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}.brand{font:900 37px/1 var(--display);letter-spacing:-.09em;text-decoration:none;white-space:nowrap}
/* The familiar island stays dark and interactive against its paper surroundings. */
.island{--text:#fffaf0;--secondary:#b8b6a9;--row:#33332b;--control:#454538;--accent:#de6c50;position:fixed;z-index:50;left:50%;top:16px;transform-origin:50% 0;background:#25251f;color:var(--text);border:1px solid #111;box-shadow:0 4px 0 #25251f20;overflow:hidden;contain:layout paint;font-size:12px;line-height:1.3}
.island.morph{transition:width .42s var(--morph),height .42s var(--morph),border-radius .42s var(--morph),transform .42s var(--morph),top .42s var(--morph)}.island .rest,.island .details{position:absolute}.island .rest{left:9px;top:7px;width:211px;height:32px;transition:opacity .12s ease,transform .25s ease}.island .details{left:17px;top:14px;width:312px;opacity:0;visibility:hidden;transform:translateY(5px) scale(.97);transform-origin:top center;pointer-events:none;transition:opacity .1s ease,transform .2s ease}.island[data-mode=rest] .rest{opacity:1;visibility:visible;transition-delay:.12s}.island:not([data-mode=rest]) .rest{opacity:0;visibility:hidden;transform:translateY(-3px);pointer-events:none}.island[data-mode=player] .player,.island[data-mode=menu] .menu{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition:opacity .2s ease .09s,transform .32s var(--morph) .06s}.rest-open{display:flex;align-items:center;gap:11px;height:100%;padding:0;text-decoration:none}.rest-cover{display:grid;place-items:center;width:28px;height:28px;flex-shrink:0;border-radius:50%;background:var(--logo)}.rest-cover svg{width:25px;height:25px}.rest-open strong{flex:1;font-family:var(--display);font-size:17px;font-weight:700;letter-spacing:-.7px}.activity{display:flex;align-items:center;gap:2px;margin-right:9px}.activity i{width:2px;height:3px;border-radius:2px;background:#aaa}.activity.playing i{height:10px;background:var(--logo);animation:levels 1s ease-in-out infinite alternate}.activity.playing i:nth-child(2){height:5px;animation-delay:-.5s}.activity.playing i:nth-child(3){height:8px;animation-delay:-.2s}@keyframes levels{to{height:3px}}.details header{display:flex;align-items:center;gap:8px;height:23px}.wordmark{flex:1;font-family:var(--display);font-size:17px;font-weight:700;letter-spacing:-.6px;text-decoration:none}.status{font-size:9px;color:var(--secondary)}.details header button{display:grid;place-items:center;min-width:24px;min-height:24px;border-radius:6px;color:var(--secondary)}.details header button:hover{background:var(--control)}.song{display:flex;align-items:center;gap:11px;margin:18px 0 13px}.cover{width:45px;height:45px;flex-shrink:0;border-radius:9px;background:var(--logo);position:relative}.cover:before{content:'';position:absolute;inset:7px;border:5px solid #25251f;border-radius:50%}.metadata{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}.metadata strong{font-size:12px;font-weight:600}.metadata span{font-size:11px;color:var(--secondary)}.play{display:grid;place-items:center;width:34px;height:34px;border-radius:8px}.play:hover{background:var(--control)}.volume{display:flex;align-items:center;gap:12px;color:var(--secondary);font-size:11px}.volume input{flex:1;min-width:0;height:16px;cursor:pointer;accent-color:var(--logo)}.volume output{width:27px;font-size:10px;text-align:right;font-variant-numeric:tabular-nums}.bottom{display:flex;align-items:center;justify-content:space-between;margin-top:8px}.bottom button{font-size:11px;color:var(--text);min-height:28px}.bottom span{font-size:9px;color:var(--secondary)}.links{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:12px}.links a{min-width:0;max-width:100%;display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:11px;background:var(--row);text-decoration:none}.links a:hover{background:var(--control)}.links a[aria-current=page]{background:var(--accent)}.links a[aria-current=page] small{color:#fffaf0}.links .icon{flex-shrink:0;width:18px;height:18px;opacity:.8}.links span{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}.links strong{font-size:11.5px;font-weight:500;overflow-wrap:anywhere}.links small{font-size:10px;color:var(--secondary);overflow-wrap:anywhere}
/* A scroll-bound stage: the arms follow the island, the legs fall away. */
.hero{height:172svh;min-height:1000px;border-bottom:1.5px solid var(--text)}.hero-scene{position:sticky;top:0;height:100svh;min-height:640px;overflow:hidden}.hero-character{position:absolute;width:clamp(180px,23vw,330px);bottom:4%;pointer-events:none}.hero-tenaga{left:4%;transform:rotate(-12deg)}.hero-ashinaga{right:4%;transform:rotate(10deg)}.hose-svg{display:block;width:100%;height:100%;overflow:visible}.hero-bottom{position:absolute;left:var(--gutter);right:var(--gutter);bottom:25px;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:10px;z-index:3}.hero-bottom>span:last-child{font-size:9px;letter-spacing:.1em}.scroll-cue{font-size:11px;text-decoration:none;display:flex;align-items:center;gap:18px}.scroll-cue span{font-size:20px}.lift-stage{position:fixed;inset:0;z-index:49;pointer-events:none;overflow:hidden}.lift-stage svg{display:block;width:100%;height:100%;overflow:hidden}.island-leg-group{transform-origin:center top}.island-hand{fill:var(--paper);stroke:var(--text);stroke-width:2.4;stroke-linejoin:round}
.intro-section{padding-top:110px;padding-bottom:70px}.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1.5px solid var(--text);border-bottom:1.5px solid var(--text)}.fact{padding:30px 30px 34px;display:flex;flex-direction:column}.fact+.fact{border-left:1px solid var(--line)}.fact:first-child{padding-left:0}.fact:last-child{padding-right:0}.fact-art{height:230px;margin:10px 0 8px}.fact h3{font:700 24px/1.12 var(--display);letter-spacing:-.055em;margin:10px 0 14px}.fact p{font-size:14px;margin:0 0 20px;flex:1}.fact>a{align-self:start;font-size:12px;font-weight:700;text-decoration:none;border-bottom:1px solid var(--text);padding-bottom:3px}.hose-separator{width:100%;height:120px;overflow:hidden;margin:25px 0}.hose-separator .hose-svg{min-width:850px;width:100%;height:100%;object-fit:cover}.hose-separator.reverse{transform:scaleX(-1)}
.essentials-section{padding-top:40px;padding-bottom:70px}.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:40px}.section-head h2{margin-bottom:20px}.section-head p{margin:0;font-size:14px}.library{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1.5px solid var(--text);border-left:1px solid var(--line)}.app{display:flex;align-items:flex-start;gap:16px;padding:26px 22px;background:transparent;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background .2s}.app:hover{background:#efc34b22}.glyph{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;background:var(--paper);border:1.5px solid var(--text);border-radius:12px}.glyph img{width:22px;height:22px;filter:brightness(0);opacity:.9}.app>div{min-width:0}.app h3{margin:1px 0 0;font-size:15px;font-weight:700;line-height:1.3}.app h3 small{font:9px var(--mono);font-weight:400;color:var(--tertiary);display:block;margin-top:6px}.app p{margin:10px 0 0;font-size:12px;line-height:1.65}.store-link{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:25px;padding:32px;background:var(--logo);border:1.5px solid var(--text);border-radius:4px;text-decoration:none;box-shadow:4px 4px 0 var(--text);transition:transform .2s,box-shadow .2s}.store-link:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--text)}.store-link>span:first-child{display:flex;flex-direction:column;gap:10px}.store-link strong{font:700 clamp(26px,3vw,40px)/1.15 var(--display);letter-spacing:-.045em}.store-link span span:last-child{font-size:13px}.store-link-arrow{font-size:38px}
.get{position:relative;display:grid;grid-template-columns:1.6fr 1fr;gap:20px;align-items:center;margin-top:50px;margin-bottom:100px;padding-top:60px;padding-bottom:60px;background:var(--logo);border-top:1.5px solid var(--text);border-bottom:1.5px solid var(--text)}.get h2{margin-top:20px}.get p{max-width:480px;font-size:15px;color:var(--text)}.get small{display:block;max-width:480px;margin-top:20px;font-size:11px;color:#4b4837}.get .get-art{height:340px}.buttons{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;padding:10px 22px;border:1.5px solid var(--text);border-radius:30px;font-size:12px;font-weight:700;text-decoration:none;background:transparent;transition:transform .2s,box-shadow .2s}.btn:hover{transform:translateY(-2px);box-shadow:0 3px 0 var(--text)}.btn.primary{background:var(--text);color:var(--paper)}.site-foot{max-width:1300px;margin:0 auto;padding:32px var(--gutter) 40px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;border-top:1px solid var(--line);font-size:11px}.site-foot>span{color:var(--secondary)}.site-foot nav{display:flex;gap:25px;flex-wrap:wrap}.site-foot nav a{text-decoration:none}.site-foot nav a:hover{text-decoration:underline;text-underline-offset:4px}
.art-visible .hose-character{animation:cartoon-bob 4s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 90%}.hero-character .hose-character{animation-duration:5s}.hero-ashinaga .hose-character{animation-delay:-2s}@keyframes cartoon-bob{0%,100%{transform:rotate(-1.5deg) translateY(0)}50%{transform:rotate(1.5deg) translateY(-5px)}}
@media(min-width:1700px){.hero-character{width:390px}}
@media(max-width:1000px){.library{grid-template-columns:repeat(2,minmax(0,1fr))}.fact{padding-left:20px;padding-right:20px}.fact-art{height:185px}.hero-character{width:240px}.hero-tenaga{left:-2%}.hero-ashinaga{right:-2%}.hero-bottom>span:last-child{display:none}}
@media(max-width:640px){:root{--gutter:24px}.hero{height:165svh;min-height:0}.hero-scene{min-height:620px}.hero-character{width:180px;bottom:7%}.hero-tenaga{left:-24px}.hero-ashinaga{right:-27px}.hero-bottom{bottom:18px;justify-content:center}.hero-bottom>span{display:none}.intro-section{padding-top:65px;padding-bottom:30px}.facts{grid-template-columns:1fr}.fact,.fact:first-child,.fact:last-child{padding:26px 0 28px;display:grid;grid-template-columns:1fr 110px;column-gap:14px}.fact+.fact{border-left:0;border-top:1px solid var(--line)}.fact-art{grid-column:2;grid-row:1/5;height:160px;margin:0;align-self:center}.fact h3{font-size:24px;margin:15px 0 12px}.fact p{font-size:13px;margin-bottom:18px}.fact>a{font-size:11px;justify-self:start}.fact .label{font-size:9px}.hose-separator{height:90px;margin:15px 0}.hose-separator .hose-svg{min-width:750px;transform:translateX(-70px)}.essentials-section{padding-top:40px;padding-bottom:40px}.section-head{gap:16px;align-items:flex-start}.section-head .eyebrow{font-size:9px}.section-head h2{font-size:38px}.section-head p{font-size:13px}.section-head .count{margin-top:35px;font-size:9px;white-space:nowrap}.library{grid-template-columns:1fr}.app{padding:20px 16px}.app p{font-size:13px}.app h3 small{display:inline;margin-left:8px}.store-link{padding:24px 20px}.store-link span span:last-child{font-size:12px}.store-link .label{font-size:9px}.store-link-arrow{font-size:30px}.get{grid-template-columns:1fr;margin-top:30px;margin-bottom:45px;padding-top:45px;padding-bottom:35px}.get h2{font-size:43px}.get .get-art{height:240px;grid-row:2}.get p{font-size:14px}.get .buttons{gap:10px}.get .btn{font-size:11px;padding:10px 16px}.site-foot{gap:24px;padding-top:28px;padding-bottom:30px}.site-foot .brand{font-size:36px}.site-foot>span{font-size:10px}.site-foot nav{width:100%;justify-content:space-between;gap:15px}}
@media(max-height:760px) and (min-width:641px){.hero-character{width:220px;bottom:2%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}


/* Keep the island and the page navigation separate on narrower screens. */
.rest-open{width:100%;text-align:left}
.lift-stage{z-index:51}


@media(max-height:599px){.hero-scene{min-height:360px}.hero{min-height:0;height:175svh}.hero-character{width:145px;bottom:0}.hero-tenaga{left:2%}.hero-ashinaga{right:2%}.hero-bottom{bottom:8px}.hero-bottom>span{display:none}.hero-bottom{justify-content:center}.scroll-cue{font-size:9px}}.hero-bottom{justify-content:center}.intro-section{padding-top:75px;padding-bottom:30px}.section-head h2{font-size:clamp(32px,3.5vw,46px);margin:0}.essentials-section{padding-top:30px}.store-link{padding:21px 25px;background:transparent;border:1px solid var(--line);box-shadow:none;min-height:80px}.store-link strong{font:600 16px var(--font);letter-spacing:0}.store-link:hover{transform:none;background:var(--row);box-shadow:none}.store-link>span{font-size:28px}.get{margin-top:15px;padding-top:35px;padding-bottom:35px}.get h2{font-size:44px}.get .get-art{height:260px}.site-foot .brand{font-size:27px}
@media(max-width:640px){.intro-section{padding-top:40px}.section-head h2{font-size:32px}.section-head .count{margin-top:15px}.get .get-art{display:none}.get{display:block;margin-bottom:45px;padding-top:35px;padding-bottom:35px}.get h2{font-size:36px}.get small{font-size:10px}}

/* Full yokai silhouettes, with the same spare surface as the rest of the site. */
.hero-character{width:clamp(230px,24vw,350px);bottom:4%;height:clamp(280px,35vh,420px)}.hero-tenaga{left:3%;transform:rotate(-4deg)}.hero-ashinaga{right:4%;transform:rotate(4deg)}.fact-art{height:240px}.hero-character .hose-svg{overflow:hidden}.get{background:transparent}.store-link{border-radius:0}.art-visible .hose-character{animation-name:yokai-sway;animation-duration:6s}@keyframes yokai-sway{0%,100%{transform:rotate(-.6deg)}50%{transform:rotate(.6deg)}}
@media(max-width:640px){.hero-character{height:235px;width:165px;bottom:6%}.hero-tenaga{left:-10px}.hero-ashinaga{right:-14px}.fact-art{height:160px}.hero-bottom{bottom:15px}}
@media(max-height:599px){.hero-character{height:160px;width:155px;bottom:0}.hero-tenaga{left:0}.hero-ashinaga{right:0}}
.lift-stage{z-index:47}.hero-scene{z-index:48}.lift-grips{position:fixed;inset:0;pointer-events:none;z-index:51;overflow:hidden}.lift-grips svg{display:block;width:100%;height:100%}
.ic{display:inline-block;width:1em;height:1em;flex:none;vertical-align:-.14em;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}.ic-out{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E")}.ic-down{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M6 13l6 6 6-6'/%3E%3C/svg%3E")}.ic-right{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E")}.store-link>.ic{font-size:26px}.text-button .ic{margin-left:4px}
