@font-face{font-family:Baloo;src:url('assets/baloo.woff2') format('woff2');font-weight:400 800;font-display:swap}
@font-face{font-family:Nunito;src:url('assets/nunito.woff2') format('woff2');font-weight:200 900;font-display:swap}
:root{--paper:#fff8e8;--ink:#34452c;--soft:#617052;--leaf:#48623b;--rust:#8a4725;--edge:#d6c7a6;--shadow:rgba(83,58,29,.19)}
*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:Nunito,sans-serif;background:radial-gradient(ellipse at 12% 10%,#e0e8d3 0,transparent 46%),radial-gradient(ellipse at 94% 65%,#eee0bb 0,transparent 48%),#f5eedc;min-height:100svh}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.22;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.62' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%239a927f' opacity='.2' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
button,input{font:inherit}button{color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:disabled{cursor:default;opacity:.46}button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #174e74;outline-offset:4px}button svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}button{min-height:44px}button:hover:not(:disabled){filter:brightness(1.035)}[hidden]{display:none!important}.game-shell{width:min(100%,700px);margin:auto;padding:0 20px}.masthead{height:84px;display:flex;justify-content:space-between;align-items:center;padding:0 7px}.brand{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:1.5px;font-weight:900}.brand>svg{width:32px;height:32px;fill:none;stroke:var(--leaf);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.brand small{display:block;font-size:10px;letter-spacing:.3px;font-weight:600;margin-top:2px;color:var(--soft)}.round-button{width:44px;height:44px;border:1px solid #c5c9b3;background:#faf7e9;border-radius:50%;display:grid;place-items:center;box-shadow:0 3px 0 #d6d7c3}.game-card{position:relative;border-radius:30px;box-shadow:0 20px 60px var(--shadow),0 2px 5px #8b6f3924;background:var(--paper);isolation:isolate}.scene{position:relative;width:100%;aspect-ratio:1;container-type:inline-size;border-radius:30px 30px 0 0;overflow:hidden;background:#c9d7a9}.orchard{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none}.scene-heading{position:absolute;top:4.5%;left:0;right:0;text-align:center;text-shadow:0 1px 15px #fffbe7,0 1px 5px #fff9dc}.eyebrow{font-size:10px;font-weight:900;letter-spacing:2.3px;margin:0 0 3px}.scene-heading .eyebrow{font-size:clamp(8px,1.65cqw,11px);color:#3f5b37}h1,h2,p{margin-top:0}h1,h2{font-family:Baloo,Georgia,serif;font-weight:600}h1{font-size:clamp(36px,8.7cqw,59px);line-height:1.05;margin:0;letter-spacing:-1.3px;color:#324d30}h2{font-size:30px;line-height:1.12;margin-bottom:12px}.chapter-link{display:inline-flex;align-items:center;gap:8px;min-height:38px;border:0;background:#fffae5d9;border-radius:30px;padding:2px 14px;color:#4c593b;box-shadow:0 2px 9px #4c533111;font-size:clamp(10px,2cqw,13px);font-weight:800;margin-top:4px}.sprig{font-size:22px}.bottles{position:absolute;inset:0}.jar-button{position:absolute;width:14.5%;height:19.5%;padding:0;border:0;background:transparent;isolation:isolate;min-height:44px;border-radius:20%;transform-origin:50% 16%;overflow:visible;z-index:2}.jar-button:before{content:"";position:absolute;left:10%;right:9%;height:8%;bottom:-1%;background:radial-gradient(ellipse,#2e1f16ac,transparent 70%);filter:blur(2px);z-index:-1;transform:scaleX(1.14)}.jar-button svg{width:100%;height:100%;overflow:visible;stroke:none;fill:initial}.jar-button .jar-id{position:absolute;left:50%;bottom:-14%;transform:translateX(-50%);border-radius:50%;min-width:18px;height:18px;padding:1px 3px;color:#fff7df;background:#5e3e25d6;box-shadow:0 1px 3px #1e170a60;font-size:10px;font-weight:900;line-height:16px}.jar-button.selected{transform:translateY(-7%);filter:drop-shadow(0 0 6px #fffbc6)}.jar-button.selected:after{content:"";position:absolute;bottom:-24%;left:40%;width:20%;height:5%;border-radius:50%;background:#fff8c4;box-shadow:0 0 10px #ffed7c}.jar-button[aria-disabled=true]{cursor:default}.jar-button:focus-visible{outline:3px solid #fff7d6;box-shadow:0 0 0 6px #2e563d;outline-offset:3px}.jar-button.pouring{z-index:8}.jar-button.receiving{filter:drop-shadow(0 0 4px #fff4c275)}.pour-stream{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:7}.pour-stream path{fill:none;stroke-linecap:round}.loading-note{position:absolute;top:39%;left:12%;right:12%;padding:16px;background:#fff8e8ed;border-radius:12px;text-align:center;font-weight:700}.paper-footer{position:relative;text-align:center;padding:20px 22px 23px;background:linear-gradient(0deg,#fff8e8,#fdf5df);border-top:1px solid #e1c78f;border-radius:0 0 30px 30px}.paper-footer:before{content:"";position:absolute;top:-7px;left:0;right:0;height:8px;background:linear-gradient(135deg,transparent 50%,#fdf5df 51%) 0 0/12px 12px,linear-gradient(225deg,transparent 50%,#fdf5df 51%) 0 0/12px 12px}.instruction{font-size:17px;line-height:1.35;font-weight:900;margin:0 0 5px}.subinstruction{font-size:12px;color:#616848;line-height:1.45;margin:0 0 18px}.tools{display:flex;gap:10px;justify-content:center;align-items:center}.wood-button,.paper-button,.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:12px;padding:10px 16px;font-weight:900;font-size:13px;min-height:47px}.wood-button{background:repeating-linear-gradient(2deg,transparent 0 9px,#77422116 10px 11px),linear-gradient(#c18c50,#a96d3c);border:1px solid #935e2f;color:#fff9e8;text-shadow:0 1px 2px #69411f;box-shadow:0 3px 0 #83542e,inset 0 1px 0 #e7bd81}.paper-button{background:#fffbed;border:1px solid #d1c4a5;box-shadow:0 3px 0 #e3d6b9}.primary-button{background:var(--leaf);color:#fffbe9;border:1px solid #354b29;box-shadow:0 3px 0 #2e4225;min-height:48px}.sound-button{font-size:11px;gap:6px}.page-footer{padding:18px 8px 24px;text-align:center;font-size:10px;color:#626b51;line-height:1.8}.page-footer span{display:block}.solved-panel{padding:17px 0 0}.solved-flower{font-size:37px;color:#b0712c;line-height:1;margin:0 0 10px}.solved-panel h2{font-size:29px;margin-bottom:4px}.solved-panel p:not(.solved-flower){font-size:13px}.solved-actions{display:flex;flex-direction:column;align-items:center;gap:8px}.text-button{border:0;background:transparent;text-decoration:underline;text-underline-offset:4px;padding:10px;font-size:13px;font-weight:800}.solved-mode .instruction,.solved-mode .subinstruction{display:none}.solved-mode .tools{padding-bottom:14px;border-bottom:1px solid #dfd3b7}.notice{padding:16px;background:var(--paper)}dialog{border:1px solid #dfceaa;border-radius:24px;padding:35px 28px 25px;background:var(--paper);color:var(--ink);box-shadow:0 25px 90px #18231250;max-width:440px;width:calc(100% - 32px);max-height:85svh;overflow:auto}dialog::backdrop{background:#26331d70;backdrop-filter:blur(5px)}dialog>p{font-size:14px;line-height:1.6}dialog>.primary-button{width:100%;margin:4px 0 20px}.close-button{position:absolute;right:10px;top:8px;width:44px;background:none;border:0;font-size:25px}.setting{display:flex;align-items:center;justify-content:space-between;padding:17px 0;border-top:1px solid #ded4bc;gap:16px;font-size:14px;font-weight:900}.setting small{display:block;font-size:11px;font-weight:600;color:var(--soft);margin-top:4px}.setting input{width:24px;height:24px;accent-color:var(--leaf);flex:none}.how-to{font-size:12px!important;line-height:1.7!important;color:var(--soft);border-top:1px solid #ded4bc;padding-top:16px}.danger{color:var(--rust)}.confirm-actions{display:flex;justify-content:flex-end;gap:12px}.journey-dialog{max-width:510px}.chapters{display:flex;flex-direction:column;gap:12px}.chapter{border:1px solid #d4c9aa;border-radius:14px;background:#fffbea;overflow:hidden}.chapter summary{padding:14px;cursor:pointer;min-height:54px;font-weight:900}.chapter summary small{font-size:11px;font-weight:600;display:block;margin:3px 0 0 16px;color:var(--soft)}.chapter.locked{opacity:.65}.puzzle-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;padding:0 13px 14px}.puzzle-grid button{background:#f3ecd8;border:1px solid #d4c9aa;border-radius:10px;font-size:12px;font-weight:800;min-width:0}.puzzle-grid button.earned{background:#e4ebd7;border-color:#9daf83}.puzzle-grid button.current{outline:2px solid #4b6239;outline-offset:0;background:#fff4c9}.empty-chapter{font-size:12px;padding:0 14px 12px;margin:0;color:var(--soft)}
.bottles{pointer-events:none}.jar-button{pointer-events:auto}
.studio-link{display:flex;align-items:center;justify-content:center;min-height:44px;width:fit-content;margin:7px auto 0;padding:0 12px;color:var(--leaf);font-size:12px;font-weight:900;text-underline-offset:4px}.studio-link:focus-visible{outline:3px solid #174e74;outline-offset:2px;border-radius:8px}
@media(min-width:1000px){.game-shell{width:650px}.masthead{height:72px}.scene{max-height:610px}.paper-footer{padding-top:16px;padding-bottom:20px}.page-footer span{display:inline}.page-footer span+span:before{content:" / ";margin:0 8px;opacity:.5}}
@media(max-width:480px){.game-shell{padding:0 10px}.masthead{height:67px;padding:0 5px}.game-card{border-radius:22px}.scene{border-radius:22px 22px 0 0}.paper-footer{border-radius:0 0 22px 22px;padding:18px 10px 20px}.scene-heading{top:5%}.chapter-link{min-height:44px;margin-top:0;padding:0 10px;gap:5px}.instruction{font-size:14px}.subinstruction{font-size:11px;max-width:270px;margin:0 auto 17px}.tools{gap:8px}.wood-button,.paper-button{padding:9px 12px;font-size:12px;gap:6px}.sound-button{flex-direction:column;font-size:9px;padding:4px 10px;gap:0;min-width:61px}.sound-button svg{width:20px;height:20px}.jar-button .jar-id{bottom:-20%;min-width:15px;height:15px;font-size:9px;line-height:13px}.page-footer{padding-top:14px;font-size:9px}.solved-panel h2{font-size:26px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media(max-height:500px) and (min-width:700px) and (min-aspect-ratio:3/2){
  .game-shell{width:100%;max-width:1000px;padding:0 10px;--landscape-scene:clamp(304px,calc(100svh - 86px),380px)}
  .masthead{height:40px;padding:0 8px}.brand small{display:none}.brand>svg{height:26px;width:26px}.round-button{min-height:34px;width:34px;height:34px}.round-button svg{width:18px;height:18px}
  .game-card{display:grid;grid-template-columns:var(--landscape-scene) minmax(0,1fr);border-radius:20px}
  .scene{width:var(--landscape-scene);height:var(--landscape-scene);max-height:none;border-radius:20px 0 0 20px}
  .scene-heading{top:4%}.scene-heading h1{font-size:34px}.scene-heading .eyebrow{font-size:8px}.chapter-link{font-size:10px;min-height:38px;margin-top:0;gap:5px;padding:0 10px}
  .paper-footer{display:flex;flex-direction:column;align-items:center;justify-content:center;border-top:0;border-left:1px solid #e1c78f;border-radius:0 20px 20px 0;padding:15px}
  .paper-footer:before{display:none}.instruction{font-size:17px;max-width:310px}.subinstruction{font-size:12px;max-width:300px;margin:6px 0 24px}.tools{gap:8px}.wood-button,.paper-button{padding:10px 12px;font-size:12px}.sound-button{font-size:10px;flex-direction:column;gap:0;padding:4px 10px}.sound-button svg{height:20px;width:20px}
  .page-footer{display:flex;align-items:center;justify-content:center;gap:18px;height:44px;padding:0;font-size:9px;line-height:1.2}.page-footer span{display:block;max-width:370px}.page-footer span+span{display:none}.studio-link{margin:0;font-size:11px;flex:none}
  .solved-mode .tools{padding-bottom:10px}.solved-panel{padding-top:12px}.solved-flower{display:none}.solved-panel h2{font-size:25px}.solved-panel p:not(.solved-flower){font-size:12px;margin-bottom:8px}.solved-actions{gap:3px}.solved-actions .primary-button{font-size:12px;min-height:44px}.solved-actions .text-button{min-height:36px;padding:6px;font-size:12px}
}