@import url('../farm/style.css');
:root{background:#fbf5e8;color:#5d5847}.brand-mark{background:#ffe2be}.brand-mark svg{width:30px;height:35px}.brand small{color:#ab8a6e;font-size:9px;letter-spacing:1.5px}.brand h1{color:#715845}.picnic-world{background:radial-gradient(ellipse at 50% 10%,#fff9dc,#eaf0d8 56%,#d5e8c3);border-color:#d8dfbf}.picnic-order{min-width:0;padding:8px 12px 10px 17px;border-color:#e1bd93;border-bottom-color:#c69a6d;box-shadow:0 5px 22px #80512f12}.picnic-order .order-label{font-size:12px;color:#9e7451}.picnic-order .order-content{gap:14px}#equation{display:flex;align-items:center;gap:9px;margin:0;outline:none;font:700 37px/1.1 TrainNumbers,sans-serif;color:#755334}.equation-part{display:flex;align-items:center;gap:5px}.equation-part svg{width:30px;height:39px}.equation-part b{font-weight:700}.operator{font-size:23px;color:#a99d7f}.bunny-part b{color:#b75c4c}.bear-part b{color:#307f98}.total-part b{color:#557744}#missing{display:grid;place-items:center;width:41px;height:46px;border:2px dashed #6daec0;background:#e5f6f5;border-radius:11px}body.solved #missing{border-style:solid;background:#d7efd0;color:#3d7952}.listen{width:49px;height:49px;background:#e38c4f;color:#fffaf0;border:3px solid #fffaf0;outline:2px solid #b8693d;box-shadow:0 4px #ae663f}.listen:hover{background:#cb7540}.round-progress{top:29px}.bottom-note{left:24px;bottom:22px;gap:11px;min-height:63px;padding:8px 13px;border:2px solid #dfcaa5;border-bottom:4px solid #c8ab80;max-width:42%;}.bottom-note p{font-size:12px;color:#7b775c}.remaining{display:flex;align-items:center;gap:7px;padding-right:10px;border-right:1px solid #dfd0b6;white-space:nowrap;font:700 32px TrainNumbers,sans-serif;color:#b26641}.remaining svg{width:28px;height:34px}.bottom-note.success{border-color:#8eb984;background:#edf7dc}.bottom-note.success p{color:#3a7953}.play-actions{position:absolute;right:25px;bottom:26px;display:flex;align-items:center;gap:12px;z-index:5}.small-action{display:grid;place-items:center;width:56px;height:56px;border:3px solid #fffcf0;border-radius:19px;background:#e8af61;color:#704d25;outline:2px solid #b78a4e;box-shadow:0 5px #a87a43;touch-action:manipulation;cursor:pointer}.small-action .icon{width:28px;height:28px}.small-action:hover{background:#f4c780}.small-action:disabled{opacity:.42;cursor:default}.small-action:focus-visible{outline:4px solid #215aa3;outline-offset:5px}.picnic-friends{display:flex;justify-content:center;align-items:center;gap:13px;margin:0 auto 13px}.picnic-friends svg{width:70px;height:80px}.picnic-friends .demo-fruit{width:40px;height:50px}.picnic-friends.small svg{width:43px;height:51px}.welcome-demo{display:flex;align-items:center;justify-content:center;gap:12px;margin:16px auto}.welcome-demo>.demo-fruit{width:37px;height:49px}.demo-plate{display:grid;place-items:center;width:63px;height:60px;border:5px solid #fffaf0;border-radius:50%;box-shadow:0 0 0 3px #dc876b;background:#f6b49b}.demo-plate.blue{background:#a1d6df;box-shadow:0 0 0 3px #4d9db4}.demo-plate svg{width:34px;height:40px}.primary{background:#d97c4e;border-color:#b45e38;box-shadow:0 4px #9d4e2e}.primary:hover{background:#c8683b}.primary .icon{width:23px;height:23px;vertical-align:middle;margin-left:7px}.tap-help{font-size:12px;line-height:1.8;color:#8a795f}.motion-setting input{accent-color:#cf7449}.close{background:#f7e6ce;color:#ad7348}.feedback-wrong .picnic-order{border-color:#df865f}.fallback-picnic{position:absolute;inset:23% 4% 17%;display:grid;grid-template-columns:1fr 1fr;gap:15px;align-content:center}.fallback-zone{min-height:140px;border:5px solid #fff7e4;outline:3px solid #c56d55;border-radius:26px;background:#f6ccb4;padding:12px;display:flex;flex-direction:column}.fallback-zone[data-zone="bear"]{background:#c4e7e6;outline-color:#3e8fa7}.fallback-zone[data-zone="basket"]{grid-column:1/-1;background:#f5e0ac;outline-color:#b28a40;min-height:140px}.fallback-zone>button{align-self:center;display:flex;align-items:center;justify-content:center;gap:9px;min-width:110px;min-height:50px;background:#fff8e4;border:2px solid currentColor;border-radius:15px;color:#775738;font:700 22px TrainNumbers,sans-serif;cursor:pointer}.fallback-zone>button svg{width:30px;height:36px}.fallback-fruits{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;padding:12px 0}.fallback-fruits button{display:grid;place-items:center;width:57px;height:65px;background:#fff2cb;border:3px solid #c65c44;border-radius:18px;cursor:pointer}.fallback-fruits button[aria-pressed="true"]{outline:4px solid #277fa3;outline-offset:3px}.fallback-fruits svg{width:38px;height:46px}.fallback-picnic button:focus-visible{outline:4px solid #1c6195;outline-offset:4px}.fallback-picnic button:disabled{opacity:.55}.picnic-controls button{touch-action:manipulation}.picnic-controls button[data-kind="fruit"]{touch-action:none}
@media(max-width:900px){.brand h1{font-size:15px}.picnic-order{top:17px}.play-actions{right:20px;gap:10px}.bottom-note{left:20px;max-width:40%}.round-progress{left:17px}.brand small{font-size:8px}}
@media(max-width:600px){.brand h1{font-size:11.5px}.brand small{font-size:6px;letter-spacing:.8px}.picnic-order{top:15px;padding:6px 8px 8px 12px}.picnic-order .order-label{font-size:10px}.picnic-order .order-content{gap:9px}#equation{font-size:29px;gap:5px}.equation-part{gap:2px}.equation-part svg{width:22px;height:30px}.operator{font-size:19px}#missing{width:32px;height:38px}.listen{width:42px;height:43px}.round-progress{top:117px;left:17px;flex-direction:row;align-items:center;gap:9px}#progress{display:flex;gap:3px}.progress-star{width:17px;height:17px}.bottom-note{left:14px;bottom:19px;padding:7px 9px;max-width:40%;min-height:56px;gap:6px}.remaining{font-size:26px;padding-right:0;border-right:0}.remaining svg{width:22px;height:28px}.bottom-note p{font-size:9px;max-width:70px}.play-actions{right:16px;bottom:23px;gap:8px}.small-action{width:43px;height:45px;border-radius:15px}.small-action .icon{width:24px;height:24px}.fallback-picnic{inset:28% 4% 18%;gap:10px}.fallback-zone{padding:8px;min-height:150px}.fallback-fruits{gap:5px}.fallback-fruits button{width:48px;height:56px}.fallback-fruits svg{width:32px;height:40px}}
@media(max-height:650px) and (min-width:601px){.picnic-order{top:9px;padding-block:5px}#equation{font-size:31px}.equation-part svg{height:32px;width:25px}#missing{height:39px;width:37px}.listen{width:43px;height:43px}.round-progress{top:17px}.play-actions{bottom:16px}.small-action{width:48px;height:49px}.bottom-note{bottom:14px;min-height:55px}}
#equation #target{font:inherit;min-width:0;color:#b75c4c}

.fallback-fruits button[hidden]{display:none}