:root{color-scheme:light;--paper: #fbf6ec;--ink: #2b2118;--muted: #7d6a58;--faint: #c9b9a2;--accent: #93a074;--serif: "Fraunces", Georgia, "Times New Roman", serif;--body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--vh: 100vh}@supports (height: 100svh){:root{--vh: 100svh}}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;height:100%}html{-webkit-text-size-adjust:100%}body{background:var(--paper);color:var(--ink);font:17px/1.55 var(--body);overflow-x:hidden}.paper{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;background:radial-gradient(120% 90% at 50% 40%,#fffcf5e6,#fbf6ec00 55%),radial-gradient(140% 120% at 50% 50%,transparent 60%,rgba(150,115,70,.12) 100%),url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.45  0 0 0 0 0.35  0 0 0 0 0.2  0 0 0 0.05 0'/></filter><rect width='220' height='220' filter='url(%23n)'/></svg>"),var(--paper)}main{min-height:var(--vh)}.scene{min-height:var(--vh);padding:max(28px,env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) 28px max(22px,env(safe-area-inset-left))}.scene.center{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:18px}.scene{transition:opacity .6s ease}.scene.leaving{opacity:0}h1,h2{font-family:var(--serif);font-weight:400;font-variation-settings:"SOFT" 100,"opsz" 144;margin:0;text-wrap:balance;letter-spacing:-.01em}h1{font-size:clamp(2.6rem,8vw,5.4rem);line-height:1.04}.title{position:relative}.title .swap{display:inline-flex;align-items:baseline;white-space:nowrap;padding-top:.3em}.title .n{display:inline-block;max-width:0;opacity:0;overflow:hidden;vertical-align:bottom;transition:max-width .45s ease,opacity .35s ease .1s}.title .gap{display:inline-block;width:.26em;transition:width .55s cubic-bezier(.65,0,.35,1)}.fade.quick{transition-duration:.7s}.title.open .n{max-width:.7em;opacity:1}.title.still .n,.title.still .gap{transition:none!important}.title-ink{position:absolute;left:-10%;width:120%;pointer-events:none}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}h2{font-size:clamp(1.7rem,4.4vw,2.8rem);line-height:1.15}.lede{font-family:var(--serif);font-size:clamp(1.1rem,2.2vw,1.35rem);color:var(--muted);max-width:32em;margin:0;text-wrap:balance}.small{font-size:.9rem;color:var(--muted);margin:0}.fade{opacity:0;transform:translateY(6px);transition:opacity 1.4s ease,transform 1.4s ease}.fade.in{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){.fade{transition:none}}.actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:center;margin-top:10px}button{font:inherit;color:inherit}.go{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:12px 30px;border-radius:999px;border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);font:500 1.08rem/1 var(--body);letter-spacing:.01em;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .12s ease,background-color .2s ease,opacity .2s ease}.go:hover{background:#46362a}.go:active{transform:scale(.98)}.go:disabled{opacity:.3;cursor:default}.go.small{min-height:44px;padding:9px 22px;font-size:1rem}.quiet{background:none;border:none;padding:10px 12px;color:var(--muted);cursor:pointer;font-size:.98rem;-webkit-tap-highlight-color:transparent;border-radius:10px}.quiet:hover{color:var(--ink)}.quiet:disabled{opacity:.35;cursor:default}.link{background:none;border:none;padding:0;color:var(--ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}.go:focus-visible,.quiet:focus-visible,.link:focus-visible,.tool:focus-visible,.pill:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.tools{display:grid;grid-template-columns:repeat(4,minmax(120px,170px));gap:14px;margin-top:12px}@media(max-width:640px){.tools{grid-template-columns:repeat(2,minmax(120px,160px))}}.tool{display:flex;flex-direction:column;align-items:center;gap:10px;padding:22px 12px 16px;border-radius:18px;background:#fffcf5b3;border:1.5px solid var(--faint);cursor:pointer;color:var(--ink);transition:border-color .2s ease,background .2s ease,transform .15s ease;-webkit-tap-highlight-color:transparent}.tool:hover,.tool.guess{border-color:var(--ink)}.tool:active{transform:scale(.98)}.tool svg{width:58px;height:58px;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.tool span{font-size:.98rem}.kooka-wrap{position:relative;width:min(78vw,420px);aspect-ratio:1 / 1;max-height:48vh}#kooka{width:100%;height:100%;display:block;touch-action:none;cursor:grab;position:relative;z-index:1}.kooka-shadow{position:absolute;left:30%;right:30%;bottom:13%;height:7%;border-radius:50%;background:radial-gradient(closest-side,rgba(90,60,30,.22),transparent)}#kooka-said{min-height:1.6em;transition:opacity .5s ease}.show{width:min(calc(100vw - 190px),900px,(var(--vh) - 400px) * 1.6);display:flex;flex-direction:column;align-items:center;gap:10px;opacity:0;transform:translateY(6px);transition:opacity .9s ease,transform .9s ease}.show.ready{opacity:1;transform:none}.stage{position:relative;width:100%;aspect-ratio:16 / 10;border-radius:22px;overflow:hidden;box-shadow:0 12px 40px #3c281429;background:#f6eedb}.stage canvas.ink{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:2;pointer-events:none}.set{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity 0ms linear .65s}.set.on{opacity:1;z-index:1;transition:opacity .6s ease}.ex-journal{background:#3a2a1e}.ex-journal video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.ex-vn{background:#6b4a33;overflow:hidden}.vn-bg{position:absolute;top:-2%;right:-2%;bottom:-2%;left:-2%;background:url(/media/still-kitchen.webp) center / cover;filter:blur(1.2px) saturate(1.05)}.vn-kooka{position:absolute;right:12%;bottom:25%;height:50%;filter:drop-shadow(0 8px 14px rgba(40,25,15,.35))}.vn-box{position:absolute;left:4%;right:4%;bottom:4%;height:25%;border-radius:16px;background:linear-gradient(#fffbf3f2,#f9f1e2f2);border:1.5px solid rgba(43,33,24,.45);box-shadow:0 8px 24px #1e120a4d}.vn-name{position:absolute;left:4%;top:0;transform:translateY(-55%);padding:.3em 1.1em;border-radius:999px;background:#93a074;color:#fffaf1;font:600 clamp(.75rem,1.8vw,1.05rem)/1.2 var(--body);letter-spacing:.02em;box-shadow:0 3px 8px #1e120a40}.vn-more{position:absolute;right:3.5%;bottom:12%;width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-top:9px solid rgba(43,33,24,.6);opacity:0;transition:opacity .3s ease}.show[data-written=vn] .vn-more{opacity:1;animation:more 1.1s ease-in-out infinite}@keyframes more{50%{transform:translateY(3px)}}.ex-card{background:linear-gradient(160deg,#b9835a,#8f5b3a)}.card{position:absolute;left:22%;right:22%;top:10%;bottom:10%;background:#fffaf1;border-radius:6px;box-shadow:0 10px 30px #28140a59;transform:rotate(-1.5deg)}.card-doodle{position:absolute;right:8%;bottom:8%;width:14%;fill:#d2504640;stroke:#aa3228cc;stroke-width:2.2;stroke-linejoin:round}.ex-comic{background:url(/media/still-mill.webp) center / cover}.bubble{position:absolute;left:4%;top:6%;width:42%;height:30%;background:#fffaf1;border:2.5px solid #2b2118;border-radius:50%}.bubble:after{content:"";position:absolute;left:58%;bottom:-18%;width:12%;height:26%;background:#fffaf1;border-right:2.5px solid #2b2118;border-bottom:2.5px solid #2b2118;transform:skew(-30deg) rotate(25deg);border-bottom-right-radius:80% 60%}.ex-writeon{background:#fbf6ec}.ex-film{background:#1a120d;overflow:hidden}.film-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(#140e0a4d,#140e0a80),url(/media/lookout-sunset-1920.webp) center / cover;transform-origin:60% 55%}.set.on .film-bg{animation:drift 14s ease-out both}@keyframes drift{0%{transform:scale(1)}to{transform:scale(1.07)}}.film-bars{position:absolute;top:0;right:0;bottom:0;left:0;border-top:solid #0d0a08;border-bottom:solid #0d0a08;border-width:7.5% 0}.noun{display:inline-block;font-style:italic;transition:opacity .22s ease}.stage-row{position:relative;width:100%}.show-arrow{position:absolute;top:50%;z-index:3;width:64px;height:64px;margin-top:-32px;border-radius:50%;display:grid;place-items:center;padding:0;border:1.5px solid transparent;background:transparent;color:var(--ink);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .12s ease,background .2s ease,border-color .2s ease}.show-arrow svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.show-arrow.next{right:-78px}.show-arrow.back{left:-78px}.show-arrow[hidden]{display:none}@media(hover:hover){.show-arrow:hover{border-color:#2b211880;background:#fbf6ecd9}}.show-arrow:active{transform:scale(.92)}@media(max-width:640px){.show{width:92vw}.show-arrow.next{right:0}.show-arrow.back{left:0}}.dots{display:flex;gap:10px}.dots button{width:9px;height:9px;padding:0;border-radius:50%;border:none;background:var(--faint);cursor:pointer}.dots button[aria-current=true]{background:var(--ink)}#show-go{opacity:0;transform:translateY(6px);transition:opacity .7s ease,transform .7s ease}#show-go.in{transform:none}#show-go.in{opacity:1}.scene.write{display:flex;flex-direction:column;justify-content:center;gap:10px;padding-left:0;padding-right:0}.dock{position:relative;width:100%;height:64px;overflow:hidden}.dock-row{position:absolute;left:0;bottom:4px;display:flex;align-items:baseline;white-space:pre;font-family:var(--serif);color:var(--faint);transition:opacity .5s ease;will-change:transform}.dock-row span{line-height:1}.dock-row .done{color:var(--muted)}.dock-row .now{color:var(--ink)}.dock-row span[data-plain]{font-family:Georgia,Times New Roman,serif}.strip-wrap{width:100%}#strip{display:block;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:crosshair}.hint{text-align:center;color:var(--muted);margin:0 22px;min-height:1.5em;font-size:.98rem}.bar{display:flex;align-items:center;gap:6px;max-width:900px;width:100%;min-height:44px;margin:0 auto;padding:0 16px}.grow{flex:1}.next-word{border:1.5px solid var(--faint);background:#fffcf5cc;border-radius:999px;min-height:44px;padding:8px 18px;cursor:pointer;color:var(--ink);font-size:1rem;-webkit-tap-highlight-color:transparent}.next-word:disabled{opacity:.35;cursor:default}.letters{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 7px;max-width:760px;margin:8px auto 0;padding:0 16px;font-family:Caveat,cursive;font-size:1.35rem;line-height:1.1}.letters span{transition:color .8s ease}.next-word.nudge{animation:nudge 1.6s ease-in-out infinite;border-color:var(--ink)}@keyframes nudge{0%,to{transform:translate(0)}50%{transform:translate(4px)}}.meter{max-width:560px;width:100%;margin:6px auto 0;padding:0 16px}.meter-head{display:flex;justify-content:space-between;align-items:baseline;font-size:.9rem;color:var(--muted);margin-bottom:4px}.meter-bar{position:relative;height:10px;border-radius:999px;background:#2b211814;margin-bottom:18px}.meter-fill{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:999px;background:var(--ink);opacity:.75;transition:width .9s ease}.meter-mark{position:absolute;top:12px;transform:translate(-50%);font-size:.78rem;color:var(--muted);white-space:nowrap}.meter-mark:before{content:"";position:absolute;left:50%;top:-14px;width:1.5px;height:12px;background:var(--muted)}.meter-mark.reached{color:var(--ink);font-weight:600}.finish{display:grid;justify-items:center;gap:8px;margin-top:14px}.finish-or{margin:0;font-size:.88rem;color:var(--muted);text-align:center}.finish.arrive{animation:arrive .7s ease .7s both}.finish.arrive .go{animation:ring 1.6s ease-out 1.5s 2}@keyframes arrive{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes ring{0%{box-shadow:0 0 #2b211859}to{box-shadow:0 0 0 16px #2b211800}}@media(prefers-reduced-motion:reduce){.finish.arrive,.finish.arrive .go{animation:none}}.rotate{position:fixed;top:0;right:0;bottom:0;left:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:var(--paper);font-family:var(--serif);font-size:1.3rem}.rotate svg{width:80px;height:80px;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;animation:tip 2.4s ease-in-out infinite}@keyframes tip{0%,30%{transform:rotate(0)}60%,to{transform:rotate(-90deg)}}@media(max-height:500px){.scene.write{gap:4px;padding-top:max(8px,env(safe-area-inset-top));padding-bottom:6px}.letters{display:none}.meter{margin-top:0}.meter-head{font-size:.78rem;margin-bottom:2px}.meter-bar{height:7px;margin-bottom:12px}.meter-mark{top:8px;font-size:.7rem}.meter-mark:before{top:-10px;height:9px}.finish{margin-top:2px}.finish-or{display:none}#finish-go{font-size:.85rem;min-height:34px;padding:4px 18px}.dock{height:40px}.hint{font-size:.85rem;min-height:1.1em}.bar .quiet,.bar .next-word,.bar .go.small{min-height:38px;padding-top:5px;padding-bottom:5px}body[data-scene=s-write] .menu{display:none}}.scene.letters-scene{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding-bottom:max(48px,env(safe-area-inset-bottom))}.board{width:min(100%,1000px);display:grid;gap:14px;text-align:left}.board-status{display:grid;justify-items:center;gap:8px}.board-status .small{margin:0}.need{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.need:empty{display:none}.need button{min-width:44px;height:44px;padding:0 12px;border-radius:22px;border:1.5px solid #b5452c;background:#fffcf5d9;color:#b5452c;font:400 1.7rem/1 Caveat,cursive;cursor:pointer;-webkit-tap-highlight-color:transparent}.need button:hover{background:#fff8ef}.board-section{display:grid;gap:6px}.board-section h3{margin:10px 0 2px;font:500 .85rem/1.2 system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.board-row{display:grid;grid-template-columns:2.4em 1fr auto;gap:10px;align-items:center;padding:4px 0 8px;border-bottom:1px solid var(--line)}.board-row h4{margin:0;font:400 1.6rem/1 Caveat,cursive;color:var(--muted);text-align:center}.board-row.none h4{color:#b5452c}.board-row.none .board-cells:before{content:"none yet";font-size:.85rem;color:var(--faint)}.board-add{width:34px;height:34px;border-radius:50%;border:1.5px dashed var(--faint);background:transparent;color:var(--muted);font:300 22px/1 system-ui,sans-serif;display:grid;place-items:center;padding:0 0 2px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:border-color .2s ease,color .2s ease,background .2s ease}.board-add:hover{border-style:solid;border-color:var(--ink);color:var(--ink)}.board-row.none .board-add{border-style:solid;border-color:#b5452c;color:#b5452c}.board-cells{display:flex;flex-wrap:wrap;gap:6px}.board-cell{position:relative;padding:0;border:1.5px solid transparent;border-radius:10px;background:#fffcf5cc;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .2s ease,border-color .2s ease}.board-cell:hover{border-color:var(--faint)}.board-cell canvas{display:block}.board-cell[aria-pressed=true]{opacity:.3}.board-cell.fresh{animation:fresh 2.4s ease .6s}@keyframes fresh{0%,to{box-shadow:0 0 #93a07400}25%{box-shadow:0 0 0 4px #93a074b3}}.board-cell.suggested{border:1.5px dashed #b5452c;opacity:.5}.board-cell[aria-pressed=true]:after{content:"";position:absolute;left:8%;right:8%;top:50%;border-top:2px solid #b5452c;transform:rotate(-30deg)}.board-actions{margin-top:18px}.letters{cursor:pointer}.scene.pond-scene{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.pond-wrap{position:relative;width:min(100%,1100px);height:min(58vh,560px);border-radius:28px;overflow:hidden;box-shadow:inset 0 0 40px #28464640}#pond{width:100%;height:100%;display:block;cursor:text}.pond-input{position:absolute;left:0;bottom:0;width:100%;height:40px;opacity:0;font-size:16px;border:0}.pens{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.pill{min-height:38px;padding:7px 15px;border-radius:999px;border:1.5px solid var(--faint);background:#fffcf5b3;cursor:pointer;font-size:.95rem;-webkit-tap-highlight-color:transparent}.pill[aria-pressed=true]{border-color:var(--ink);background:var(--ink);color:var(--paper)}.uses{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:760px}.use-steps{max-width:36em;text-align:left;background:#fffcf5bf;border:1.5px solid var(--faint);border-radius:18px;padding:16px 22px}.use-steps ol{margin:0;padding-left:1.2em;display:grid;gap:8px}.use-steps pre{background:#f2e9d8;border-radius:10px;padding:10px 12px;overflow-x:auto;font-size:.85rem}.name{display:inline-flex;gap:10px;align-items:center;color:var(--muted)}.name input{font:1rem var(--body);padding:10px 14px;border:1.5px solid var(--faint);border-radius:999px;background:#fffcf5cc;min-width:12em;color:var(--ink)}.film{width:min(92vw,760px);aspect-ratio:16 / 9;border-radius:20px;overflow:hidden;background:#e9dfcc;box-shadow:0 10px 40px #3c28142e}.film video{width:100%;height:100%;object-fit:cover;display:block}.menu{position:fixed;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));z-index:4;text-align:right}.menu-list{display:grid;gap:2px;margin-top:4px;padding:8px;border-radius:14px;background:#fffcf5f5;border:1px solid var(--faint);box-shadow:0 6px 24px #3c28141f}.menu-list button,.menu-list .file{background:none;border:none;text-align:left;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:.95rem;color:var(--ink)}.menu-list button:hover,.menu-list .file:hover{background:#f2e9d8}.file{position:relative}.file input{position:absolute;width:1px;height:1px;opacity:0}.storage{position:fixed;left:50%;bottom:14px;transform:translate(-50%);background:var(--ink);color:var(--paper);padding:10px 16px;border-radius:12px;font-size:.92rem;z-index:6}@media(max-height:500px){.scene.center{gap:8px;padding-top:max(12px,env(safe-area-inset-top));padding-bottom:12px}h1{font-size:2.3rem}h2{font-size:1.35rem}.lede{font-size:.98rem}.kooka-wrap{width:min(50vw,300px);max-height:46vh}.show{width:min(68vw,560px,(var(--vh) - 150px) * 1.6);gap:4px}.show-arrow{width:48px;height:48px;margin-top:-24px}.show-arrow svg{width:26px;height:26px}.show-arrow.next{right:-56px}.show-arrow.back{left:-56px}.scene.pond-scene{gap:6px;padding-top:max(10px,env(safe-area-inset-top))}.pond-scene .lede{display:none}.pond-wrap{height:54vh;border-radius:18px}.film{width:min(60vw,460px)}}