@font-face{font-family:LocalSerif;src:local("Songti SC"),local("STSong");font-display:swap}
:root{--paper:#f6f4ed;--ink:#344c5a;--muted:#8b9697;--sea:#6b91aa;--line:#e4e5dc;--blue-pale:#e8f0f3;--warm:#ece5d5;--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}html{height:100%;background:#dfe7e7}body{margin:0;color:var(--ink);font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:15px;-webkit-font-smoothing:antialiased}button,textarea{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent;color:inherit}button:focus-visible,textarea:focus-visible{outline:2px solid var(--sea);outline-offset:4px}button{border:0;background:none}button:disabled{opacity:.45;cursor:wait}.home{height:100dvh;max-width:500px;margin:auto;background:var(--paper);position:relative;overflow:hidden;display:flex;flex-direction:column;isolation:isolate}.home:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.36;background-image:radial-gradient(#c6cfca .6px,transparent .6px);background-size:12px 12px;pointer-events:none}.topbar{padding:calc(19px + env(safe-area-inset-top,0px)) 23px 17px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(246,244,237,.96);z-index:5}.brand{display:flex;gap:12px;align-items:center}.brand-mark{width:43px;height:43px;display:grid;place-items:center;border-radius:15px 15px 19px 10px;background:#e2ebed;transform:rotate(-7deg);font-family:LocalSerif,serif;font-size:27px;color:#5f8297}.brand h1{font-size:19px;letter-spacing:2px;margin:0 0 5px;font-weight:600}.tiny-star{font-size:12px;color:#b5ac8a;margin-left:8px;vertical-align:top}.brand p{font-size:11px;letter-spacing:1px;margin:0;color:var(--muted);display:flex;align-items:center;gap:5px}.brand i{width:5px;height:5px;background:#b1b3aa;border-radius:50%}.brand p.ready i{background:#8aa58d}.notebook{display:flex;gap:5px;align-items:center;font-size:11px;letter-spacing:1px;padding:9px 0 9px 9px;color:#6d8087}.notebook svg{width:21px;height:21px}.conversation{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 23px;scrollbar-width:thin;scrollbar-color:#d7dfdc transparent}.intro{padding-top:34px;position:relative;min-height:286px}.eyebrow{font-size:8px;letter-spacing:2.1px;color:#9aa4a3}.intro-title{font-family:LocalSerif,"Songti SC",serif;font-size:27px;letter-spacing:1px;line-height:1.75;margin-top:9px;position:relative;z-index:1}.intro-title span{display:block;font-size:34px;letter-spacing:3px}.intro-title sup{position:absolute;top:46px;left:136px;font-size:25px;color:#9cafb5}.intro>p{font-size:11px;color:#92a0a1;letter-spacing:.5px;margin:7px 0}.intro-fish{position:absolute;right:-10px;top:49px;width:170px;height:170px;transform:rotate(5deg);filter:drop-shadow(0 10px 8px #7895a11a);mask-image:linear-gradient(#000 88%,transparent)}.intro-note{font-size:10px;color:#97a2a1;letter-spacing:1px;position:absolute;bottom:25px;left:0}.intro-note span{font-size:15px;margin-right:4px;color:#8ba8b7}.day-label{text-align:center;font-size:9px;letter-spacing:2px;color:#a4abaa;padding:6px 0 22px;display:flex;gap:15px;align-items:center}.day-label:before,.day-label:after{content:"";height:1px;flex:1;background:var(--line)}.message{display:flex;flex-direction:column;align-items:flex-start;margin:0 0 20px;animation:arrive .25s ease-out}.message.user{align-items:flex-end}.message .speaker{font-size:9px;color:#93a1a5;letter-spacing:1px;margin:0 0 7px 3px}.message.user .speaker{margin-right:4px}.bubble{max-width:90%;font-size:14px;line-height:1.85;letter-spacing:.3px;white-space:pre-wrap;overflow-wrap:anywhere;border-radius:3px 17px 17px 17px;padding:13px 16px;background:#fffdf8;box-shadow:0 2px 8px #374b4f04;border:1px solid #e8e7de}.message.user .bubble{background:#dfeaf0;border-color:#dfeaf0;border-radius:17px 3px 17px 17px;color:#426478}.typing{font-size:11px;color:#92a4ab;padding:0 7px;letter-spacing:1px}.typing[hidden]{display:none}.typing b{display:inline-block;animation:dot 1s infinite;font-size:20px;font-weight:400}.typing b:nth-child(3){animation-delay:.15s}.typing b:nth-child(4){animation-delay:.3s}.chat-bottom-space{height:185px}.pet-corner{position:absolute;right:10px;bottom:calc(144px + var(--safe-bottom));width:137px;z-index:3;pointer-events:none;text-align:center;transition:bottom .2s}.fish-button{width:132px;height:132px;padding:0;position:relative;display:block;pointer-events:auto;touch-action:manipulation}.fish-button canvas{position:relative;width:132px;height:132px;z-index:1;filter:drop-shadow(0 3px 2px #4d6e7210)}.pet-shadow{position:absolute;bottom:2px;left:35px;width:70px;height:8px;border-radius:50%;background:#9bb2b427;filter:blur(3px)}.pet-tag{font-size:8px;color:#9da9a9;letter-spacing:.5px;display:block;margin-top:2px}.pet-thought{font-size:10px;line-height:1.6;background:#fffdf7;border:1px solid #e5e5d9;box-shadow:0 3px 10px #52646706;border-radius:13px 13px 3px 13px;padding:8px 10px;max-width:155px;margin:0 -1px 2px -19px;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s}.pet-thought.show{opacity:1;transform:translateY(0)}.composer-area{background:var(--paper);border-top:1px solid #e6e7df;padding:0 18px calc(8px + var(--safe-bottom));z-index:4;position:relative}.small-actions{height:39px;display:flex;align-items:center;gap:14px;justify-content:center}.small-actions>span{width:1px;height:10px;background:#dadfd7}.small-actions button{font-size:10px;color:#8b9d9f;letter-spacing:1px;padding:10px 8px}.small-actions button:active{transform:scale(.96);color:#497c99}.composer{display:flex;align-items:flex-end;gap:10px;padding:8px 9px 8px 15px;border:1px solid #dfe4dd;border-radius:23px;background:#fffdf8;box-shadow:0 3px 10px #32464804}.composer textarea{resize:none;flex:1;min-width:0;border:0;outline:0;background:none;min-height:25px;max-height:100px;line-height:25px;font-size:13px;padding:2px 0;color:var(--ink)}.composer textarea::placeholder{color:#adb7b5}.send{background:#6d91a7;color:#fff;width:32px;height:32px;border-radius:50%;padding:7px;flex-shrink:0}.send svg{width:18px;height:18px;display:block}.footer-note{font-size:8px;color:#aeb6b0;letter-spacing:1.6px;text-align:center;margin:10px 0 0}.error{font-size:11px;color:#946a5c;text-align:center;line-height:1.6;margin:8px 5px 0}dialog{position:fixed;margin:auto;inset:0;width:min(440px,calc(100% - 30px));max-height:76dvh;border:1px solid #e2e6dc;border-radius:25px;padding:27px 24px;background:var(--paper);color:var(--ink);box-shadow:0 20px 60px #344c5a28}dialog::backdrop{background:#263c4b45;backdrop-filter:blur(4px)}.sheet-head{display:flex;justify-content:space-between;align-items:center}.sheet-head h2{font-family:LocalSerif,serif;font-size:24px;letter-spacing:2px;margin:8px 0}.sheet-head button{font-size:26px;color:#8c9d9e;padding:0 4px}.sheet-caption,.memory-tip{font-size:11px;line-height:1.8;color:#94a09e}.memory-tip{border-top:1px solid var(--line);padding-top:15px;margin-top:24px}.memory-entry{font-size:13px;line-height:1.8;padding:12px 14px;background:#fffdf8;border:1px solid #e5e7df;border-radius:12px;margin:10px 0}.memory-empty{padding:35px 10px;text-align:center;color:#9ba6a4;font-size:12px;line-height:2}.home.has-chat .intro{min-height:0;padding-top:22px;padding-bottom:22px}.home.has-chat .intro .eyebrow,.home.has-chat .intro>p,.home.has-chat .intro-fish,.home.has-chat .intro-note{display:none}.home.has-chat .intro-title{font-size:17px;margin:0;line-height:1.6;color:#8b9fa5}.home.has-chat .intro-title span{display:inline;font-size:17px;letter-spacing:1px}.home.has-chat .intro-title sup{display:none}@keyframes arrive{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes dot{50%{opacity:.3;transform:translateY(-2px)}}@media(min-width:600px){body{padding:24px}.home{height:calc(100dvh - 48px);border-radius:30px;box-shadow:0 18px 70px #445c681c;border:1px solid #cdd9d7}.topbar{padding-top:21px}.conversation{padding:0 28px}.intro{padding-top:32px}.intro-fish{right:7px}}@media(max-width:350px){.topbar{padding-left:17px;padding-right:17px}.conversation{padding:0 17px}.intro-title{font-size:23px}.intro-title span{font-size:29px}.intro-fish{width:145px;height:145px;right:-5px}.pet-corner{right:5px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* Phone keyboard and first-visit invitation. */
.home{height:var(--viewport-height,100dvh)}.composer textarea{font-size:16px}.welcome-gate{display:none}.checking-access .home{visibility:hidden}.checking-access .welcome-gate{display:grid;position:fixed;inset:0;z-index:20;place-items:center;background:var(--paper);padding:24px}.welcome-card{width:100%;max-width:340px;text-align:center}.welcome-fish{width:190px;height:190px;margin:0 auto 25px;filter:drop-shadow(0 12px 12px #4c788519)}.welcome-card h2{font:30px LocalSerif,"Songti SC",serif;letter-spacing:3px;margin:14px 0}.welcome-card p{font-size:12px;line-height:2;color:#93a3a4;max-width:290px;margin:15px auto}.welcome-card button{margin-top:15px;padding:14px 26px;border-radius:25px;background:#6d91a7;color:#fff;font-size:14px;letter-spacing:1px}.welcome-card button[hidden]{display:none}.welcome-card button span{margin-left:12px}#welcome-error{color:#a27c6b}.keyboard-open .intro{display:none}.keyboard-open .pet-corner{width:82px;bottom:calc(136px + var(--safe-bottom));right:6px}.keyboard-open .fish-button,.keyboard-open .fish-button canvas{width:80px;height:80px}.keyboard-open .pet-tag,.keyboard-open .pet-thought{display:none}.keyboard-open .chat-bottom-space{height:110px}@media(min-width:600px){.home{height:calc(var(--viewport-height,100dvh) - 48px)}}
/* A reserved pet nook keeps the character beside the chat without covering messages. */
.pet-corner{position:relative;right:auto;bottom:auto;width:100%;height:116px;flex-shrink:0;display:flex;align-items:flex-end;justify-content:flex-end;padding:0 15px 13px}.fish-button,.fish-button canvas{width:105px;height:105px}.pet-tag{position:absolute;right:17px;bottom:3px;margin:0}.pet-thought{position:absolute;right:128px;bottom:41px;margin:0;width:max-content;max-width:185px;text-align:left}.chat-bottom-space{height:10px}.pet-shadow{width:58px;left:25px}.keyboard-open .pet-corner{position:relative;right:auto;bottom:auto;width:100%;height:65px;padding-bottom:0}.keyboard-open .fish-button,.keyboard-open .fish-button canvas{width:64px;height:64px}.keyboard-open .chat-bottom-space{height:8px}@media(max-height:600px){.pet-corner{height:75px;padding-bottom:4px}.fish-button,.fish-button canvas{width:72px;height:72px}.pet-tag{display:none}.pet-thought{right:100px;bottom:25px}}

/* Lightweight articulated pet: no atlas download is needed for the first paint. */
.intro-fish{background:none;filter:none;mask-image:none}
.intro-fish .pet-art{width:100%;height:100%}
.pet-art{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 5px 3px #527b8c12)}
.pet-art *{transform-box:fill-box;transform-origin:center}
.pet-body{animation:fish-breathe 3.6s ease-in-out infinite}
.pet-tail{transform-origin:left center;animation:fish-tail 2.4s ease-in-out infinite}
.pet-arm{transform-origin:top right;animation:fish-wave 4.5s ease-in-out infinite}
.pet-tuft{transform-origin:bottom center;animation:fish-tail 3.6s ease-in-out infinite}
.pet-eyes{animation:fish-blink 5.4s infinite}
.pet-pupil{transform:translate(var(--eye-x,0px),var(--eye-y,0px));transition:transform .15s ease-out}
.pet-cheeks{opacity:.5}
.pet-happy-eyes,.pet-mouth-open,.pet-mouth-chew,.pet-rice-grains{display:none}
.pet-corner{height:159px;padding:0 18px 16px}
.fish-button{width:145px;height:145px;transition:filter .2s;touch-action:manipulation}
#pet-character{display:block;width:100%;height:100%;position:relative;z-index:1}
.pet-shadow{left:40px;bottom:6px;width:78px;height:7px;background:#91aab124}
.pet-tag{right:19px;bottom:5px;font-size:9px;letter-spacing:.4px}
.pet-thought{right:174px;bottom:61px;max-width:185px;border-radius:15px 15px 3px 15px;font-size:12px;line-height:1.8;padding:9px 12px;background:#fffdf7}
.pet-thought:after{content:"";position:absolute;right:-5px;bottom:10px;width:8px;height:8px;transform:rotate(45deg);background:#fffdf7;border-top:1px solid #e5e5d9;border-right:1px solid #e5e5d9}
#fish[data-state=anticipating] .pet-body,#fish[data-state=catching] .pet-body{animation:none}
#fish[data-state=anticipating] .pet-arm{animation:fish-wave .45s ease-in-out infinite}
#fish[data-state=catching] .pet-mouth-smile,#fish[data-state=chewing] .pet-mouth-smile{display:none}
#fish[data-state=catching] .pet-mouth-open{display:block;animation:fish-open .22s ease-out both}
#fish[data-state=chewing] .pet-mouth-chew,#fish[data-state=chewing] .pet-rice-grains{display:block}
#fish[data-state=chewing] .pet-mouth-chew{animation:fish-chew .3s ease-in-out infinite}
#fish[data-state=chewing] .pet-cheeks{opacity:.8}
#fish[data-state=chewing] .cheek-left{animation:fish-puff .3s ease-in-out infinite alternate}
#fish[data-state=chewing] .cheek-right{animation:fish-puff .3s ease-in-out infinite alternate-reverse}
#fish[data-state=chewing] .pet-body{animation:fish-munch .3s ease-in-out infinite}
#fish[data-state=chewing] .pet-eyes,#fish[data-state=pat] .pet-eyes,#fish[data-state=satisfied] .pet-eyes{display:none}
#fish[data-state=chewing] .pet-happy-eyes,#fish[data-state=pat] .pet-happy-eyes,#fish[data-state=satisfied] .pet-happy-eyes{display:block}
#fish[data-state=pat] .pet-body{animation:fish-pat .5s ease-out}
#fish[data-state=pat] .pet-tail,#fish[data-state=satisfied] .pet-tail{animation:fish-tail .32s ease-in-out infinite}
#fish[data-state=pat] .pet-cheeks,#fish[data-state=satisfied] .pet-cheeks{opacity:.85}
#fish[data-state=satisfied] .pet-body{animation:fish-content .65s ease-out}
#fish[data-state=thinking] .pet-tuft{animation:fish-tail .65s ease-in-out infinite}
#fish[data-state=thinking] .pet-body{animation:fish-think 3s ease-in-out infinite}
.flying-food{position:fixed;left:0;top:0;width:42px;height:42px;z-index:60;pointer-events:none;filter:drop-shadow(0 4px 3px #846c4824);will-change:transform}
.flying-food svg{display:block;width:100%;height:100%}
.pet-heart{position:fixed;z-index:61;color:#cf91a1;font:25px Georgia,serif;pointer-events:none}
.small-actions{height:47px;gap:23px}
.small-actions button{min-height:44px;font-size:12px;padding:10px 12px;letter-spacing:.5px;color:#708c96;display:flex;align-items:center;gap:5px;touch-action:manipulation}
.small-actions button:disabled{opacity:.7;cursor:default}
.food-button-icon{display:inline-block;font-size:19px;line-height:1}
.small-actions .feeding .food-button-icon{animation:fish-content .6s infinite}
.checking-access .welcome-gate{display:flex;align-items:flex-start;justify-content:center;padding:clamp(35px,9svh,85px) 24px calc(24px + var(--safe-bottom));overflow-y:auto}
.welcome-card{max-width:340px}
.welcome-fish{background:none;width:190px;height:190px;margin:0 auto 16px;filter:none}
.welcome-fish .pet-body{animation:fish-breathe 3.6s ease-in-out infinite}
.welcome-card .eyebrow{font-size:9px;letter-spacing:2px}
.welcome-card h2{font-size:29px;margin:16px 0 12px}
.welcome-card p{margin:12px auto;line-height:1.9;font-size:13px}
.welcome-card button{min-height:49px;padding:14px 25px;margin-top:17px}
.keyboard-open .pet-corner{height:65px;padding-bottom:0}
.keyboard-open .fish-button{width:64px;height:64px}
.keyboard-open .pet-shadow{display:none}
.keyboard-open .small-actions{height:39px}
@keyframes fish-breathe{0%,100%{transform:translateY(0) rotate(-.8deg)}50%{transform:translateY(-1.3px) rotate(.8deg)}}
@keyframes fish-tail{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(9deg)}}
@keyframes fish-wave{0%,70%,100%{transform:rotate(0)}80%{transform:rotate(13deg)}90%{transform:rotate(-7deg)}}
@keyframes fish-blink{0%,90%,96%,100%{transform:scaleY(1)}93%{transform:scaleY(.08)}}
@keyframes fish-open{from{transform:scale(.2)}to{transform:scale(1)}}
@keyframes fish-chew{0%,100%{transform:translateY(0) scaleX(.8)}50%{transform:translateY(.7px) scaleX(1.3)}}
@keyframes fish-puff{from{transform:scale(1)}to{transform:scale(1.3,1.15)}}
@keyframes fish-munch{0%,100%{transform:translateY(0) scale(1.005,.995)}50%{transform:translateY(.55px) scale(.995,1.005)}}
@keyframes fish-pat{0%{transform:scale(1)}25%{transform:translateY(2px) scale(1.06,.94)}65%{transform:translateY(-1px) scale(.98,1.03)}100%{transform:scale(1)}}
@keyframes fish-content{0%,100%{transform:translateY(0)}40%{transform:translateY(-3px) rotate(-3deg)}70%{transform:rotate(3deg)}}
@keyframes fish-think{0%,100%{transform:rotate(0)}50%{transform:rotate(5deg)}}
@media(min-width:760px){.home{max-width:620px}.pet-corner{height:181px;padding-right:32px}.fish-button{width:166px;height:166px}.pet-tag{right:38px}.pet-thought{right:218px;bottom:75px;max-width:250px}.conversation{padding:0 32px}.composer-area{padding-left:28px;padding-right:28px}.checking-access .welcome-gate{padding-top:clamp(50px,9svh,100px)}}
@media(max-width:350px){.pet-corner{height:141px;padding-right:12px}.fish-button{width:130px;height:130px}.pet-thought{right:151px;max-width:155px;font-size:11px}.pet-tag{right:12px}}
@media(max-height:620px){.pet-corner{height:95px;padding-bottom:6px}.fish-button{width:88px;height:88px}.pet-thought{right:116px;bottom:29px}.pet-tag{display:none}.welcome-fish{width:135px;height:135px;margin-bottom:9px}.checking-access .welcome-gate{padding-top:24px}.welcome-card h2{font-size:25px;margin:10px 0}.welcome-card p{margin:7px auto}.welcome-card button{margin-top:10px}}
@media(prefers-reduced-motion:reduce){.pet-body,.pet-tail,.pet-arm,.pet-tuft,.pet-eyes{animation:none!important}.flying-food{filter:none}}
#fish[data-state=anticipating] .pet-eyes,#fish[data-state=catching] .pet-eyes{animation:none}
#fish[data-state=anticipating] .pet-pupil,#fish[data-state=catching] .pet-pupil{transform:translateY(.5px)}

/* Keep the document still while Safari moves and resizes its visual viewport. */
html{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
body{position:fixed;inset:0;width:100%;height:100%;padding:0;overflow:hidden;overscroll-behavior:none}
.home{position:absolute;top:var(--viewport-top,0px);left:0;right:0;width:100%;height:var(--viewport-height,100dvh);margin:0 auto}
.topbar,.composer-area{flex-shrink:0}
.conversation{-webkit-overflow-scrolling:touch}
.keyboard-open{--safe-bottom:0px}
.keyboard-open .pet-corner,.keyboard-open .small-actions,.keyboard-open .footer-note,.keyboard-open .day-label{display:none}
.keyboard-open .topbar{padding:calc(9px + env(safe-area-inset-top,0px)) 18px 9px}
.keyboard-open .brand-mark{width:34px;height:34px;font-size:22px}
.keyboard-open .brand h1{font-size:16px;margin-bottom:3px}
.keyboard-open .composer-area{padding:8px 14px}
.keyboard-open .conversation{padding-top:12px}
.keyboard-open .composer textarea{scroll-margin:0;scroll-padding:0}
@media(min-width:600px){.home{top:calc(var(--viewport-top,0px) + 24px);width:calc(100% - 48px);height:calc(var(--viewport-height,100dvh) - 48px)}}

/* The same original fish mark is used in the header and browser icon. */
.brand-mark{width:44px;height:44px;flex-shrink:0;background:none;border-radius:0;transform:none}
.brand-mark img{display:block;width:100%;height:100%;object-fit:contain}