@import url('/pond-crane.css');
@import url('/pond-music.css');
/* A pond painted on the same paper as the rest of Haiku Artist. */
.pond-frog-visit{position:absolute;inset:0;z-index:1;pointer-events:none}.pond-frog-visit *{pointer-events:none}.pond-frog{position:absolute;width:57px;height:40px;transform-origin:center bottom}.pond-frog svg{width:100%;height:100%;overflow:visible;transform-origin:center bottom;filter:drop-shadow(0 2px 2px #526d5b12)}.frog-water{position:absolute;width:83px;height:42px;opacity:0}.frog-water svg{width:100%;height:100%}.pond-tab-hidden .crane-bob,.pond-tab-hidden .blossom,.pond-tab-hidden .water-lines,.pond-tab-hidden .water-shimmer{animation-play-state:paused!important}
@media(max-width:600px){.pond-frog{width:48px;height:34px}.frog-water{width:68px;height:35px}}
@media(prefers-reduced-motion:reduce){.pond-frog-visit{display:none}}
.signature-fields{display:grid;grid-template-columns:1fr 1.35fr;gap:14px;margin-top:22px}.signature-fields>div{min-width:0}.signature-fields .note-label span{color:#626a5a}.signature-fields input{width:100%;min-height:46px;padding:10px 12px;border:1px solid #b4bdaa;border-radius:2px;background:#fdfaf3;color:#2b332d;font:14px/1.5 var(--font-sans)}.signature-fields input:focus-visible{outline:2px solid #405c50;outline-offset:3px}.signature-fields input::placeholder{color:#686e60}.signature-notice{font-size:10px;line-height:1.7;color:#586152;margin-top:9px}.reader-signature{text-align:center;overflow-wrap:anywhere;margin:-4px 0 24px}.reader-signature p{font:italic 18px/1.5 var(--font-serif);color:#405749;max-width:none;margin:0}.reader-signature a{display:inline-flex;align-items:center;min-height:44px;font-size:11px;color:#405749;text-decoration:underline;text-underline-offset:4px}.reader-signature a:focus-visible{outline:2px solid #405c50;outline-offset:3px}
.page-pond [hidden]{display:none!important}
.pond-dialog-open .floating-crane,.pond-dialog-open .crane-bob,.pond-dialog-open .blossom,.pond-dialog-open .water-lines,.pond-dialog-open .water-shimmer{animation-play-state:paused!important}
.page-pond{--pond-ink:#334b43;--pond-muted:#53635b}.page-pond main{max-width:1440px;padding-bottom:72px}.page-pond>.haiga-background{height:890px;overflow:hidden;opacity:.7}.page-pond>.haiga-background .haiga-paint{right:-260px;top:2px;width:1000px;opacity:.38}.page-pond>.fallen-petals{display:none}
.pond-intro{text-align:center;padding-top:44px;position:relative;z-index:2}.pond-intro .eyebrow{margin-inline:auto;color:#617168;font-size:10px;letter-spacing:.15em}.pond-intro .eyebrow span{padding:0 12px;color:#8c8e7f}.pond-intro h1{font-size:clamp(48px,5.3vw,76px);line-height:1.06;letter-spacing:-.045em;margin-top:20px}.pond-intro h1 em{font-weight:400;color:#617568}.pond-invitation{max-width:460px;margin:22px auto 24px;font-size:14px;line-height:1.8;color:#55594f;text-wrap:pretty}.pond-primary{border:1px solid #405c50;background:#405c50;color:#faf8f0;min-height:48px;padding:10px 23px;display:inline-flex;align-items:center;justify-content:center;gap:16px;font-size:12px;letter-spacing:.025em;border-radius:2px;box-shadow:0 3px 8px #334b4309;transition:background .2s,transform .2s}.pond-primary:hover{background:#2f483e}.pond-primary:active{transform:translateY(1px)}.pond-primary:disabled{opacity:.6;cursor:wait}.pond-primary>.paper-crane{width:30px;height:28px;--crane:#e9e6d7}.pond-primary>span:last-child{font-size:18px}.pond-demo{margin:14px auto 0;font-size:10px;color:#62665a;letter-spacing:.02em}.demo-dot{display:inline-block;width:5px;height:5px;background:#8b967d;border-radius:50%;vertical-align:middle;margin-right:5px}.pond-demo>span:nth-child(2){margin-inline:5px}
.pond-scene{margin:24px -20px 0;position:relative}.pond-toolbar{display:flex;justify-content:space-between;align-items:center;padding-inline:55px;font-size:10px;letter-spacing:.04em;color:#59675e;position:relative;z-index:2}.pond-toolbar>button{border:0;border-bottom:1px solid #a9b3a6;background:transparent;font-size:10px;min-height:44px;padding:7px 0;color:#465d50;white-space:nowrap}.pond-toolbar>button:disabled{opacity:1;cursor:default}.pond-water{height:420px;position:relative;isolation:isolate;margin-top:-22px}.pond-paint{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.water-lines{transform-origin:center;animation:water-breath 18s ease-in-out infinite alternate}.water-shimmer{position:absolute;inset:20% 12%;border-radius:50%;background:repeating-radial-gradient(ellipse at center,transparent 0 18px,#f5f4e815 19px 20px,transparent 22px 50px);opacity:.5;animation:water-breath 13s ease-in-out infinite alternate;pointer-events:none}.pond-cranes{position:absolute;inset:0}.floating-crane{position:absolute;transform:translate(-50%,-50%);width:92px;height:88px;padding:8px;border:0;background:transparent;border-radius:50%;color:var(--crane);touch-action:manipulation;animation:crane-drift var(--drift-time,20s) var(--drift-delay,0s) ease-in-out infinite alternate;z-index:2}.floating-crane:before{content:'';position:absolute;left:10%;right:10%;bottom:12%;height:13px;border:1px solid #6d91843b;border-radius:50%;box-shadow:0 2px 2px #6d91840d}.floating-crane .paper-crane{width:100%;height:100%;filter:drop-shadow(1px 7px 3px #506d6c24)}.crane-bob{display:block;width:100%;height:100%;animation:crane-bob 7s var(--drift-delay,0s) ease-in-out infinite alternate;transition:filter .2s}.floating-crane:hover,.floating-crane:focus-visible{z-index:3;animation-play-state:paused}.floating-crane:hover .crane-bob,.floating-crane:focus-visible .crane-bob{animation-play-state:paused;filter:brightness(1.04)}.floating-crane:focus-visible{outline:2px solid #405c50;outline-offset:3px;background:#f2efe888}
.pond-hint{text-align:center;max-width:none;font:italic 15px/1.7 var(--font-serif);color:#59685b;margin-top:-6px}.pond-hint span{display:block;font:10px/1.8 var(--font-sans);margin-top:3px;color:#63695f}.pond-bottom{margin-top:38px;display:flex;align-items:start;justify-content:space-between;border-top:1px solid #c4c8b980;padding-top:24px;gap:25px}.pond-footnote{text-align:right;font:11px/1.9 var(--font-serif);color:#626b5d}.pond-list{font-size:11px;color:#4e5f51;max-width:420px}.pond-list summary{cursor:pointer;min-height:44px;padding-top:6px}.pond-list summary:focus-visible{outline:2px solid #405c50;outline-offset:4px}#notes-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px;margin-top:12px}#notes-list button{min-width:0;overflow-wrap:anywhere;display:flex;align-items:center;gap:8px;text-align:left;font-size:10px;padding:8px 0;border:0;border-bottom:1px solid #b5c1b580;background:transparent;min-height:44px}#notes-list .paper-crane{width:30px;height:28px;flex-shrink:0}.pond-status{max-width:none;text-align:center;font-size:12px;color:#405c50;min-height:24px;margin-top:18px}.pond-fallback{text-align:center;margin:20px auto;font-size:13px}
.pond-petals{position:absolute;inset:-20px 0 0;overflow:hidden;pointer-events:none;z-index:4}.blossom{position:absolute;left:var(--petal-x);top:-20px;width:7px;height:12px;background:#e0b6b5;border-radius:80% 10% 60% 40%;opacity:.6;animation:petal-fall var(--fall,21s) var(--delay,0s) linear infinite}.blossom-0{--petal-x:18%;--delay:-2s}.blossom-1{--petal-x:70%;--delay:-8s;--fall:25s}.blossom-2{--petal-x:42%;--delay:-18s;--fall:29s}.blossom-3{--petal-x:87%;--delay:-12s;--fall:31s}.blossom-4{--petal-x:60%;--delay:-24s;--fall:28s}.blossom-5{--petal-x:8%;--delay:-19s;--fall:30s}.blossom-6{--petal-x:32%;--delay:-8s;--fall:33s}.blossom-7{--petal-x:76%;--delay:-3s;--fall:37s}.blossom-8{--petal-x:24%;--delay:-28s;--fall:35s}.blossom-9{--petal-x:91%;--delay:-19s;--fall:32s}.blossom-10{--petal-x:53%;--delay:-10s;--fall:26s}.blossom-11{--petal-x:4%;--delay:-5s;--fall:35s}
.pond-dialog-open{overflow:hidden}.pond-dialog{width:min(560px,calc(100% - 32px));max-height:calc(100dvh - 36px);padding:28px 34px 26px;background:#f8f5ed;color:#2b332d;border:1px solid #c5c7b7;border-radius:3px;box-shadow:0 20px 100px #243f3533;overflow:auto}.pond-dialog::backdrop{background:#273f385b;backdrop-filter:blur(5px)}.dialog-top{display:flex;justify-content:space-between;align-items:center;gap:15px}.dialog-top .eyebrow{color:#5e6b5c;font-size:9px;letter-spacing:.16em}.dialog-close{width:44px;height:44px;border:0;background:transparent;font:28px var(--font-serif);margin:-12px -14px 0 0;color:#566351}.pond-dialog h2{font-size:34px;margin:14px 0 12px;line-height:1.14}.dialog-intro{font-size:11px;line-height:1.8;color:#586152;margin-bottom:20px}.dialog-intro strong{color:#344b3e;font-weight:600}.note-label{display:block;font-size:11px;margin-bottom:8px;color:#394f42}#note-text{display:block;resize:vertical;width:100%;min-height:145px;max-height:300px;border:1px solid #b4bdaa;background:#fdfaf3;color:#2b332d;padding:16px;font:17px/1.7 var(--font-serif);border-radius:2px}#note-text::placeholder{color:#7b8070}#note-text:focus-visible,.public-consent input:focus-visible{outline:2px solid #405c50;outline-offset:3px}.note-meta{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:#626a5a;margin-top:7px}.paper-colors{border:0;padding:0;margin:24px 0 20px;min-width:0}.paper-colors legend{font-size:11px;margin-bottom:10px}.paper-colors legend span{color:#68715f}.paper-colors>div{display:flex;gap:11px;flex-wrap:wrap}.color-choice{position:relative;display:flex;width:44px;height:44px;align-items:center;justify-content:center;cursor:pointer}.color-choice input{position:absolute;inset:0;opacity:0;margin:0;width:100%;height:100%;cursor:pointer}.color-swatch{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid transparent;border-radius:50%;pointer-events:none}.color-choice input:checked+.color-swatch{outline:1px solid #405c50;outline-offset:5px}.color-choice input:focus-visible+.color-swatch{outline:3px solid #2f493d;outline-offset:5px}.public-consent{display:flex;gap:10px;font-size:11px;align-items:center;min-height:44px;cursor:pointer}.public-consent input{width:18px;height:18px;accent-color:#405c50;flex-shrink:0;margin:0}.note-error{min-height:22px;font-size:11px;color:#963e40;margin-top:6px}.composer-actions{display:flex;justify-content:flex-end;align-items:center;gap:14px;margin-top:12px}.pond-text-button{font-size:11px;text-underline-offset:4px;text-decoration:underline;border:0;background:transparent;min-height:44px;padding:8px 0;color:#52604d}.reader-dialog{width:min(540px,calc(100% - 32px));padding-bottom:26px}.reader-crane{width:62px;margin:18px auto 12px}.reader-crane .paper-crane{width:100%;height:54px}.reader-text{font:clamp(20px,3vw,25px)/1.85 var(--font-serif);text-align:center;white-space:pre-wrap;overflow-wrap:anywhere;padding:13px 4px 22px;max-width:none}.reader-caption{text-align:center;font-size:10px;color:#656c5b;margin-bottom:28px}.reader-actions{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #c7cbbd;padding-top:20px}.reader-help{font-size:10px;color:#666e5d;margin-top:10px}.pond-ripple{position:absolute;width:80px;height:25px;border:1px solid #73998a;pointer-events:none;border-radius:50%;opacity:0;transform:translate(-50%,-50%)}.pond-ripple.is-rippling{animation:land-ripple 1.7s ease-out both}
.just-tossed{visibility:hidden}.pond-flight{position:absolute;left:50%;top:35%;width:160px;height:160px;z-index:5;pointer-events:none;transform:translate(-50%,-50%);animation:toss-flight 2.7s ease-in-out both}.folding-sheet{position:absolute;inset:0;background:var(--crane);box-shadow:0 8px 20px #40534422;overflow:hidden;animation:fold-paper 1.5s ease-in-out both;transform-origin:center}.folding-sheet:after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,transparent 49.5%,#40534435 50%,transparent 50.5%),linear-gradient(45deg,transparent 49.5%,#fff6 50%,transparent 50.5%)}.folding-sheet>span{display:block;padding:20px;font:12px/1.6 var(--font-serif);white-space:pre-wrap;overflow-wrap:anywhere;color:#293d32;opacity:.8}.folded-bird{position:absolute;inset:0;opacity:0;animation:reveal-bird 2.7s ease-in-out both}.folded-bird .paper-crane{width:100%;height:100%;filter:drop-shadow(0 9px 5px #40534433)}
@keyframes crane-drift{0%{translate:-8px 0;rotate:-5deg}50%{translate:5px -6px;rotate:1deg}100%{translate:12px 7px;rotate:5deg}}@keyframes crane-bob{from{transform:translateY(-3px)}to{transform:translateY(3px)}}@keyframes water-breath{from{transform:scale(.98,1);opacity:.16}to{transform:scale(1.035,1.04);opacity:.3}}@keyframes petal-fall{0%{transform:translate(0,-5px) rotate(0);opacity:0}12%{opacity:.6}85%{opacity:.55}100%{transform:translate(60px,480px) rotate(290deg);opacity:0}}@keyframes fold-paper{0%,15%{transform:rotate(-5deg);clip-path:polygon(0 0,100% 0,100% 100%,0 100%);opacity:1}45%{transform:rotate(40deg) scale(.86);clip-path:polygon(0 0,100% 0,100% 100%,100% 100%)}75%{transform:rotate(50deg) scale(.55);clip-path:polygon(0 0,100% 0,50% 100%,50% 100%);opacity:1}100%{transform:rotate(45deg) scale(.3);opacity:0}}@keyframes reveal-bird{0%,40%{opacity:0;transform:scale(.35) rotate(-20deg)}57%,67%{opacity:1;transform:scale(1) rotate(-8deg)}100%{opacity:1;transform:scale(.5) rotate(0)}}@keyframes toss-flight{0%,60%{left:50%;top:35%}76%{left:50%;top:8%}100%{left:var(--land-x);top:var(--land-y)}}@keyframes land-ripple{0%{opacity:.8;scale:.5}100%{opacity:0;scale:2.6}}
.pond-still .floating-crane,.pond-still .crane-bob,.pond-still .blossom,.pond-still .water-lines,.pond-still .water-shimmer{animation-play-state:paused!important}.pond-still .pond-ripple{display:none}
@media(min-width:1500px){.pond-water{height:470px}}
@media(max-width:760px){.pond-intro{padding-top:28px}.pond-intro .eyebrow{font-size:8px;letter-spacing:.12em}.pond-intro h1{font-size:54px;margin-top:18px}.pond-invitation{font-size:13px;max-width:340px;margin-top:20px;margin-bottom:20px}.pond-scene{margin-inline:-20px;margin-top:24px}.pond-toolbar{padding-inline:20px;font-size:9px}.pond-water{height:360px;margin-top:-5px}.floating-crane{width:74px;height:74px;padding:7px}.pond-hint{font-size:14px;margin-top:2px}.pond-bottom{margin-top:25px;flex-direction:column;gap:12px}.pond-footnote{text-align:left}.pond-list{width:100%;max-width:none}.page-pond>.haiga-background .haiga-paint{right:-300px;top:70px;width:700px;max-width:none;opacity:.23}.page-pond main{padding-bottom:35px}.pond-water.many-cranes{height:650px}.pond-dialog{padding:22px}.pond-dialog h2{font-size:30px}.paper-colors>div{gap:2px;justify-content:space-between}.composer-actions{gap:12px}.composer-actions .pond-primary{padding-inline:17px}.reader-text{font-size:21px}.reader-dialog .reader-actions{gap:12px}.pond-demo{font-size:9px}.pond-dialog .dialog-intro{font-size:11px}}
@media(max-width:360px){.pond-intro h1{font-size:47px}.pond-dialog{padding:18px}.color-choice{width:38px}.note-meta{font-size:9px}.composer-actions{flex-wrap:wrap}.composer-actions .pond-primary{width:100%}.pond-water{height:390px}.floating-crane{width:66px;height:68px}}
@media(prefers-reduced-motion:reduce){.pond-flight{display:none}.pond-ripple{display:none}.blossom{top:50%;opacity:.3}.blossom:nth-child(2n){top:75%}.water-lines{opacity:.22}.water-shimmer{opacity:.2}}
@media(max-width:760px){.pond-water.many-cranes{height:var(--crowded-height,650px)}}
@media(max-width:760px){.paper-colors>div{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0}.color-choice{width:100%}.pond-dialog .dialog-intro{font-size:12px}.public-consent{font-size:12px}}
@media(max-width:360px){.paper-colors>div{grid-template-columns:repeat(4,minmax(44px,1fr));gap:4px}}
.floating-crane{animation:none;transform:translate(-50%,-50%) rotate(var(--heading,0deg));cursor:inherit;touch-action:pan-y;user-select:none;-webkit-user-select:none}.floating-crane .paper-crane{transform:scaleX(var(--facing,1));pointer-events:none}.floating-crane.crane-held{z-index:6}.crane-held .crane-bob{animation-play-state:paused!important;scale:1.08;filter:drop-shadow(0 8px 4px #40534430)}.crane-bob{transition:scale .18s,filter .18s}.crane-held:before{opacity:.35}
@media(max-width:760px){.signature-fields{grid-template-columns:1fr;gap:16px}.signature-fields input{font-size:16px}.signature-notice{font-size:11px}.pond-hint span{max-width:280px;margin-inline:auto}}
@media(prefers-reduced-motion:reduce){.crane-bob{transition:none}.crane-held .crane-bob{scale:1}}

.color-swatch .paper-crane{width:34px;height:30px}.color-choice input:checked+.color-swatch{outline-offset:1px;background:#405c5008}.color-choice input:focus-visible+.color-swatch{outline-offset:1px}

.pond-kindness{font-size:12px;line-height:1.65;color:#46594d;margin:14px 0}.reader-date{display:block;text-align:center;font-size:12px;line-height:1.6;color:#52604d;margin:0 0 12px}.reader-signature #reader-social-text{font:14px/1.65 var(--font-sans);margin-top:5px;color:#405749}