:root{--cream:#f8f6eb;--ink:#25452e;--muted:#6d7867;--line:#dfe2d1;--lime:#e7efac;--green:#31583a;--paper:#fffdf5;--serif:Georgia,'Times New Roman',serif;font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;color:var(--ink);background:var(--cream);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-width:320px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:disabled{cursor:default}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible,[tabindex="0"]:focus-visible{outline:3px solid #819343;outline-offset:5px}h1:focus,h2:focus{outline:none}[hidden]{display:none!important}img{user-select:none;-webkit-user-drag:none}h1,h2,p{margin:0}em{font-family:var(--serif);font-weight:400}h1{font-size:clamp(2rem,4.25vw,3.6rem);font-weight:510;letter-spacing:-.055em;line-height:1.1}h2{font-size:clamp(1.8rem,3.5vw,2.7rem);font-weight:500;letter-spacing:-.045em;line-height:1.14}.shell{max-width:1480px;min-height:100svh;margin:auto;padding:0 48px;display:flex;flex-direction:column}header{height:102px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;gap:20px}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;font-size:12px;font-weight:700;letter-spacing:.12em;line-height:1.2}.brand-mark{font:italic 42px var(--serif);background:var(--ink);color:var(--cream);width:47px;height:47px;text-align:center;line-height:38px;border-radius:50%;letter-spacing:-.12em;padding-right:7px}.for-anya{font-family:var(--serif);font-style:italic;font-size:18px}.restart{border:1px solid #cfd7c6;background:transparent;border-radius:30px;padding:10px 17px;font-size:15px}.restart:hover{background:var(--lime)}body:not([data-screen="intro"]) .for-anya{position:absolute;left:50%;transform:translateX(-50%)}main{flex:1;display:flex;justify-content:center}.screen{width:100%;animation:screen-in .6s ease both}.intro{text-align:center;padding:35px 0 28px}.eyebrow{font-size:12px;letter-spacing:.14em;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px}.eyebrow>span{width:6px;height:6px;background:#70884a;border-radius:50%}.intro h1{margin:22px auto 15px}.subtitle{font-size:17px;line-height:1.55;color:var(--muted)}.intro-art{width:440px;height:260px;position:relative;margin:3px auto 13px}.art-halo{position:absolute;width:255px;height:225px;border-radius:50%;background:#e9edcf;left:50%;top:48%;transform:translate(-50%,-50%);z-index:0}.jar-composition{position:relative;display:block;width:100%;height:100%}.intro-jar{position:absolute;left:50%;bottom:0;width:235px;height:245px;transform:translateX(-50%) rotate(-6deg)}.glass{width:100%;height:100%;object-fit:contain;position:absolute;inset:0;z-index:3;pointer-events:none;filter:drop-shadow(0 14px 12px #23402e12)}.jar-fill{position:absolute;inset:20% 20% 16%;display:block;z-index:2;overflow:hidden;border-radius:20% 20% 25% 25%}.inside-pickle{position:absolute;object-fit:contain;width:44%;height:72%;transform-origin:50% 70%;filter:drop-shadow(2px 3px 2px #133e2326)}.float-pickle{position:absolute;object-fit:contain;width:90px;height:115px;filter:drop-shadow(0 8px 8px #22432018);animation:float 5s ease-in-out infinite}.float-one{left:55px;top:20px;transform:rotate(-30deg);--rotation:-30deg}.float-two{right:40px;top:5px;width:68px;--rotation:25deg;animation-delay:-2s}.sticker{position:absolute;right:12px;bottom:20px;background:var(--lime);border:1px solid #d2db90;border-radius:50%;width:116px;height:116px;display:flex;align-items:center;justify-content:center;font:italic 18px/1.15 var(--serif);transform:rotate(13deg);box-shadow:0 5px 10px #29482e09}.art-caption{position:absolute;font:italic 17px/1.1 var(--serif);text-align:left;color:var(--muted)}.caption-left{left:1px;bottom:52px;transform:rotate(-8deg)}.primary{display:flex;align-items:center;justify-content:center;gap:24px;min-height:57px;background:var(--ink);color:var(--cream);border:1px solid var(--ink);border-radius:16px;padding:16px 23px;text-decoration:none;font-size:16px;font-weight:500;line-height:1.35;box-shadow:0 5px 0 #18301e0b;transition:background .2s,transform .2s}.primary:hover{background:#3b5d3f;transform:translateY(-2px)}.primary:active{transform:translateY(1px)}.primary>span{font-size:22px;line-height:1}.start-button{margin:auto}.micro{font-size:12px;color:var(--muted);margin-top:13px;line-height:1.4}.footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:22px 0;color:var(--muted);font-size:12px;gap:20px}.footer nav{display:flex;align-items:center;gap:16px}.footer nav>span{opacity:.5;white-space:nowrap}.footer nav>span.active{opacity:1;color:var(--ink)}.footer nav>span>span{margin-left:5px}.footer nav i{width:24px;height:1px;background:#ccd3bf}.game{max-width:740px;padding:30px 0 12px;position:relative;display:flex;flex-direction:column;height:calc(100svh - 167px);min-height:430px}.game-top{display:flex;justify-content:space-between;align-items:center;padding:0 20px}.game .eyebrow{justify-content:flex-start;margin-bottom:10px}.counter{text-align:center;border:1px solid var(--line);border-radius:20px;padding:14px 24px;background:#fffdf57a}.counter span{font-size:14px;display:block;color:var(--muted)}.counter strong{display:block;font:36px var(--serif);margin-top:3px}.progress-track{height:4px;background:#e4e7d6;border-radius:10px;margin:22px 20px 0;overflow:hidden}#progress{background:#6e8a44;height:100%;width:0;transition:width .3s}.game-tip{text-align:center;font-size:14px;color:var(--muted);margin:15px 12px 0}.arena{position:relative;flex:1;min-height:180px;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;border-radius:24px;outline-offset:0!important}.arena-lines{position:absolute;inset:8px 10px 15px;background-image:radial-gradient(#25452e15 1px,transparent 1px);background-size:25px 25px;mask-image:linear-gradient(transparent,#000 15%,#000 80%,transparent);pointer-events:none}.catcher{position:absolute;width:138px;height:151px;left:0;top:0;z-index:5;will-change:transform;pointer-events:none}.ground{position:absolute;left:10%;right:10%;bottom:10px;height:1px;background:linear-gradient(90deg,transparent,#acb996,transparent)}.falling{position:absolute;width:48px;height:74px;left:0;top:0;object-fit:contain;pointer-events:none;will-change:transform;z-index:4;filter:drop-shadow(0 5px 4px #20391e15)}.catch-pop{position:absolute;z-index:10;pointer-events:none;font-size:19px;color:#526d32;animation:pop .65s ease-out forwards}.catcher.caught .jar-composition{animation:bump .28s ease}.game-footer{text-align:center;margin-top:5px}.success{position:absolute;inset:0;z-index:20;background:#f8f6ebed;backdrop-filter:blur(8px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;animation:screen-in .4s}.success-mark{font:48px var(--serif);width:90px;height:90px;line-height:90px;border-radius:50%;background:var(--lime);margin-bottom:24px}.success p{color:var(--muted);margin-top:20px}.messages{text-align:center;max-width:940px;padding:37px 0 36px}.messages h2{margin-top:19px}.message-stage{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;margin-top:28px;min-height:405px}.message-visual{height:390px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center}.message-visual .art-halo{width:310px;height:290px;top:46%}.jar-button{border:0;background:none;padding:0;width:310px;height:325px;position:relative;z-index:2;transform:rotate(-5deg);transition:transform .25s}.jar-button:hover:not(:disabled){transform:rotate(0) translateY(-5px)}.jar-button:disabled{cursor:default}.jar-hint{position:absolute;bottom:23px;z-index:5;background:var(--lime);padding:9px 15px;border-radius:20px;font-size:14px;transform:rotate(-5deg)}.remaining{font-size:12px;letter-spacing:.04em;position:absolute;bottom:0;color:var(--muted)}.note-area{text-align:left;min-height:290px;display:flex;flex-direction:column;justify-content:center;gap:18px;max-width:430px}.note-placeholder{color:var(--muted);font:italic 26px/1.4 var(--serif);text-align:center}.small-star{font-size:50px;color:#81934f;display:block;margin-bottom:14px}.note{padding:30px 30px 27px;background:var(--paper);border:1px solid #e6e3cc;box-shadow:0 12px 30px #32421d0b;transform:rotate(2deg);position:relative;border-radius:3px 3px 24px 3px;animation:note-in .55s ease both}.note:before{content:'';position:absolute;top:-10px;left:38%;width:75px;height:22px;background:#dce5adc2;transform:rotate(-5deg)}.note-number{font-size:12px;letter-spacing:.14em;color:var(--muted)}#note-text{font:30px/1.24 var(--serif);letter-spacing:-.025em;margin:23px 0}.note-sign{font-size:12px;color:#819078;display:block;text-align:right}.next-button{font-size:15px;width:100%;animation:screen-in .35s}.final-actions{display:flex;flex-direction:column;gap:9px;animation:screen-in .4s}.secondary{border:0;background:none;padding:13px 10px;color:var(--ink);font-size:15px;text-decoration:underline;text-decoration-color:#a7b38e;text-underline-offset:5px}.secondary:hover{color:#698137}.joke-response{font-size:15px;text-align:center;line-height:1.5;color:var(--muted);animation:screen-in .4s}.flying-pickle{position:absolute;z-index:8;width:95px;height:160px;top:30px;left:calc(50% - 47px);filter:drop-shadow(0 12px 8px #25452e20);pointer-events:none;animation:extract .85s cubic-bezier(.2,.8,.25,1) both}.flying-pickle img{width:100%;height:100%;object-fit:contain}.flying-pickle.special{width:130px;height:190px;left:calc(50% - 65px);top:0;animation:extract .85s cubic-bezier(.2,.8,.25,1) both, float 5s 1s ease-in-out infinite;--rotation:-12deg}body[data-screen="game"]{overflow:hidden;overscroll-behavior:none;touch-action:none;user-select:none;-webkit-user-select:none}body[data-screen="game"] .shell{height:100svh;min-height:0}body[data-screen="game"] main{min-height:0}body[data-screen="game"] .footer{flex-shrink:0}
@keyframes screen-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes float{0%,100%{transform:translateY(0) rotate(var(--rotation,0deg))}50%{transform:translateY(-10px) rotate(calc(var(--rotation,0deg) + 5deg))}}@keyframes pop{from{opacity:1;transform:translateY(0) scale(.8)}to{opacity:0;transform:translateY(-45px) scale(1.2)}}@keyframes bump{50%{transform:scale(1.08,.93)}}@keyframes note-in{from{opacity:0;transform:translateY(20px) rotate(-2deg)}to{opacity:1;transform:translateY(0) rotate(2deg)}}@keyframes extract{0%{opacity:0;transform:translateY(120px) scale(.4) rotate(10deg)}55%{opacity:1;transform:translateY(-35px) scale(1) rotate(-15deg)}100%{opacity:1;transform:translateY(0) scale(1) rotate(-12deg)}}
@media(min-width:1500px){.intro{padding-top:50px}.intro-art{height:300px}.intro-jar{height:280px;width:265px}.intro-art .art-halo{width:280px;height:260px}}
@media(max-width:700px){.shell{padding:0 22px}header{height:80px}.brand{font-size:10px;gap:8px}.brand-mark{width:38px;height:38px;font-size:35px;line-height:31px}.for-anya{font-size:15px}body:not([data-screen="intro"]) .for-anya{display:none}.restart{font-size:14px;padding:8px 12px}.intro{padding:29px 0 25px}.eyebrow{font-size:10px;letter-spacing:.13em}.intro h1{font-size:36px;line-height:1.08;letter-spacing:-.052em;margin:20px auto 16px;max-width:430px}.desktop-break{display:none}.subtitle{font-size:16px}.intro-art{width:100%;max-width:375px;height:238px;margin:3px auto 9px}.intro-jar{width:220px;height:226px}.art-halo{width:230px;height:208px}.float-one{left:8px;top:24px;width:70px;height:97px}.float-two{right:8px;width:59px;height:90px}.caption-left{left:0;bottom:43px;font-size:14px}.sticker{width:88px;height:88px;right:0;bottom:18px;font-size:15px}.primary{border-radius:14px;padding:16px;gap:15px;font-size:15px}.start-button{width:100%;max-width:375px}.micro{font-size:12px}.footer{padding:18px 0;justify-content:center}.footer>span{display:none}.footer nav{gap:10px;font-size:11px}.footer nav i{width:16px}.game{height:calc(100svh - 132px);min-height:0;padding-top:24px}.game-top{padding:0 4px}.game h2{font-size:32px}.counter{padding:11px 18px;border-radius:17px}.counter strong{font-size:32px}.counter span{font-size:12px}.progress-track{margin:20px 4px 0}.game-tip{font-size:13px;line-height:1.45;margin-top:14px}.catcher{width:120px;height:132px}.arena{border-radius:15px;margin:0 -10px}.success h2{font-size:31px}.messages{padding:28px 0 25px}.messages h2{font-size:29px;margin-top:17px}.message-stage{display:flex;flex-direction:column;gap:23px;margin-top:12px;min-height:0}.message-visual{height:255px;width:100%}.message-visual .art-halo{height:205px;width:237px;top:47%}.jar-button{width:230px;height:242px}.jar-hint{bottom:13px;font-size:13px;padding:8px 14px}.remaining{bottom:-6px}.note-area{width:100%;min-height:150px;max-width:375px;gap:20px}.note-placeholder{font-size:22px;padding:10px 0 20px}.small-star{font-size:30px;margin-bottom:7px}.note{padding:23px 24px 21px}#note-text{font-size:26px;margin:18px 0}.note-number{font-size:10px}.note-sign{font-size:11px}.flying-pickle{width:80px;height:130px;left:calc(50% - 40px);top:0}.flying-pickle.special{width:105px;height:160px;left:calc(50% - 52px);top:-5px}}
@media(max-height:730px) and (max-width:700px){header{height:65px}.intro{padding-top:20px}.intro h1{font-size:32px;margin-top:14px}.intro-art{height:185px}.intro-jar{height:188px;width:181px}.intro-art .art-halo{width:180px;height:166px}.intro .subtitle{font-size:15px}.sticker{width:77px;height:77px;font-size:14px}.footer{padding:15px 0}.game{height:calc(100svh - 111px);padding-top:18px}.game h2{font-size:28px}.game-top .eyebrow{margin-bottom:6px}.progress-track{margin-top:14px}.game-tip{margin-top:10px}.messages{padding-top:20px}.messages h2{font-size:26px}.message-visual{height:220px}.jar-button{width:205px;height:215px}.message-visual .art-halo{width:210px;height:185px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* Fill the sprite boxes while retaining the transparent source margins. */
.inside-pickle,.float-pickle,.falling,.flying-pickle img{object-fit:cover}
