.picnic-app { min-height:100dvh; color:#3e513c; background:#f3f1e7; padding:0 24px 36px; font-family:"Quicksand","Microsoft YaHei",sans-serif; }
.picnic-app * { box-sizing:border-box; }
.picnic-topbar { max-width:1120px; margin:auto; min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:13px; }
.picnic-topbar a { color:#617057; text-decoration:none; padding:12px 0; }
.picnic-brand { font-size:15px; letter-spacing:2px; color:#59704e; }
.picnic-topbar>div { display:flex; align-items:center; gap:6px; }
.picnic-topbar button { border:0; padding:10px; background:none; color:#67715c; font:inherit; cursor:pointer; min-height:44px; }
.picnic-paper { max-width:1120px; padding:32px; margin:auto; background:#fffdf6; border:1px solid #ece9d9; border-radius:28px; box-shadow:0 18px 60px #56613514; }
.picnic-paper h1 { color:#3f583d; font-size:clamp(27px,3.8vw,43px); line-height:1.4; margin:10px 0 16px; letter-spacing:1px; }
.picnic-paper h2 { font-size:24px; color:#445d40; line-height:1.5; margin:8px 0; }
.picnic-paper p { line-height:1.85; }
.picnic-eyebrow { font-size:10px; font-weight:700; letter-spacing:2px; color:#8a946e; }
.picnic-button { display:inline-flex; justify-content:center; align-items:center; gap:18px; min-height:48px; padding:12px 22px; border:1px solid #ccd7ba; background:#eef2e3; color:#4c6643; border-radius:14px; font-family:inherit; font-size:14px; font-weight:700; line-height:1.5; cursor:pointer; transition:transform .2s,background .2s; }
.picnic-button:hover:not(:disabled) { background:#e1e9cf; transform:translateY(-2px); }
.picnic-button:disabled { opacity:.45; cursor:default; }
.picnic-app button:focus-visible,.picnic-app a:focus-visible { outline:3px solid #ae8641; outline-offset:4px; }
.picnic-text-button { background:none; border:0; color:#82906f; font:inherit; font-size:12px; padding:12px; cursor:pointer; }
.picnic-footer { color:#9a9f87; text-align:center; font-size:10px; letter-spacing:2px; margin:28px 0 0; }
.picnic-piece { display:block; width:100%; height:100%; stroke:none; fill:none; overflow:visible; pointer-events:none; }
.picnic-animal { display:block; position:relative; width:100%; height:100%; overflow:hidden; pointer-events:none; stroke:none; fill:none; }
.picnic-unit-hero { position:relative; min-height:380px; border-radius:20px; overflow:hidden; isolation:isolate; padding:36px 38px 150px; }
.picnic-unit-hero>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.picnic-unit-hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#143c32cd,transparent 85%); }
.picnic-unit-title h1 { font-size:46px; color:#fff6dd; margin:12px 0; }
.picnic-unit-title .picnic-eyebrow { color:#e3d9ac; }
.picnic-unit-title p { color:#f4f0d9; font-size:13px; }
.picnic-stamp-album { position:absolute; left:22px; right:22px; bottom:18px; display:flex; align-items:center; justify-content:space-between; gap:20px; background:#fffaf0ee; padding:14px 20px; border:1px solid #fffcf3; border-radius:16px; backdrop-filter:blur(12px); }
.picnic-stamp-album>span { font-size:12px; color:#7d8668; }
.picnic-stamp-album>span b { display:block; font:700 23px "Quicksand",sans-serif; margin-top:8px; color:#65764d; }
.picnic-stamp-album>div { display:flex; gap:22px; align-items:center; }
.picnic-unit-stamp { width:76px; height:76px; padding:10px 14px 20px; position:relative; display:inline-flex; flex-direction:column; align-items:center; border:1px dashed #9ba67b; border-radius:50%; background:#e7ecd5; color:#697d48; }
.picnic-unit-stamp>.picnic-piece,.picnic-unit-stamp>.picnic-animal { width:42px; height:42px; flex-shrink:0; }
.picnic-unit-stamp small { font-size:8px; white-space:nowrap; margin-top:2px; }
.picnic-unit-stamp i { position:absolute; top:0; right:-2px; font:10px/18px sans-serif; width:18px; height:18px; background:#73884e; color:#fff8e3; border-radius:50%; text-align:center; }
.picnic-unit-stamp.is-locked { opacity:.45; filter:grayscale(1); }
.picnic-sprout-stamp { display:flex; flex-direction:column; align-items:center; justify-content:center; width:190px; height:190px; padding:22px; background:#f1ead2; color:#63814d; border:6px double #859869; border-radius:50%; transform:rotate(-10deg); box-shadow:inset 0 0 0 6px #fff9e5; }
.picnic-sprout-stamp>svg { width:76px; height:76px; stroke:none; fill:none; }
.picnic-sprout-stamp b { font-size:20px; letter-spacing:5px; padding-left:5px; }
.picnic-sprout-stamp small { font-size:10px; letter-spacing:2px; margin-top:8px; }
.picnic-sprout-stamp.is-locked { filter:grayscale(1); opacity:.4; }
.picnic-stamp-album .picnic-sprout-stamp { width:76px; height:76px; border-width:3px; padding:10px; }
.picnic-stamp-album .picnic-sprout-stamp>svg { width:28px; height:28px; }
.picnic-stamp-album .picnic-sprout-stamp b { font-size:9px; letter-spacing:1px; }
.picnic-stamp-album .picnic-sprout-stamp small { font-size:6px; letter-spacing:0; margin-top:3px; }
.picnic-vocabulary { margin:36px 0; }
.picnic-section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:18px; margin-bottom:20px; }
.picnic-section-heading p { font-size:12px; color:#8b9477; margin:0 0 5px; }
.picnic-word-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; }
.picnic-word-card { border:1px solid #e4e6d8; background:#f8f7ed; border-radius:18px; padding:18px 10px 14px; color:#596d48; cursor:pointer; transition:transform .2s,box-shadow .2s; }
.picnic-word-card:nth-child(2n) { background:#eff3e9; }
.picnic-word-card:hover { transform:translateY(-5px); box-shadow:0 8px 20px #53683b12; }
.picnic-word-art { display:block; width:66px; height:76px; margin:0 auto 12px; }
.picnic-word-card strong { display:block; font:700 16px "Quicksand",sans-serif; }
.picnic-word-card i { font-size:12px; font-style:normal; color:#a5ad91; margin-left:6px; }
.picnic-word-card>small { font-size:11px; color:#91957e; display:block; margin-top:6px; }
.picnic-start-card { display:flex; justify-content:space-between; align-items:center; gap:24px; background:#f0f2e4; border:1px solid #dde3cc; border-radius:20px; padding:28px 32px; }
.picnic-start-card h2 { font-size:23px; }
.picnic-start-card p { font-size:12px; color:#7b8968; margin:4px 0; }
.picnic-start-card>.picnic-button,.picnic-story-card>.picnic-button { background:#54734c; color:#fff7df; border-color:#54734c; box-shadow:0 4px 0 #3f5d39; white-space:nowrap; }
.picnic-levels { display:flex; gap:8px; margin-top:18px; }
.picnic-levels .picnic-button { padding:7px 12px; min-height:34px; font-size:10px; background:transparent; border-radius:30px; }
.picnic-levels [aria-pressed=true] { background:#dce5cc; color:#526d43; border-color:#a9ba8d; }
.picnic-parent { padding:18px 0 0; margin-top:20px; border-top:1px dashed #e1e3d2; font-size:12px; color:#8a937a; }
.picnic-parent summary { cursor:pointer; }
.picnic-journey { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding:0 10px 24px; border-bottom:1px solid #e9e9dc; margin-bottom:30px; }
.picnic-journey>span { display:flex; flex-direction:column; align-items:center; gap:8px; min-width:0; color:#acb19b; font-size:10px; }
.picnic-journey i { display:grid; place-items:center; width:30px; height:30px; border:1px solid #dddcca; border-radius:50%; font:700 11px "Quicksand",sans-serif; background:#f6f5ea; }
.picnic-journey b { font-weight:400; white-space:nowrap; }
.picnic-journey .is-current { color:#5c7749; }
.picnic-journey .is-current i { background:#657e51; border-color:#657e51; color:#fff9e3; box-shadow:0 0 0 5px #edf0e0; }
.picnic-journey .is-past i { background:#e7edda; color:#718752; border-color:#d5dfc3; }
.picnic-story-scene { position:relative; min-height:540px; border-radius:22px; overflow:hidden; isolation:isolate; background:#dce8c3; }
.picnic-scene-landscape { position:absolute; inset:0; z-index:-2; background:linear-gradient(#f8f5dc08,#e4ebc430),url('./assets/picnic/forest-clearing-v3.jpg') center/cover; }
.picnic-story-scene::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,transparent 30%,#f8f8e4a8 70%); }
.picnic-intro { display:flex; align-items:center; justify-content:space-between; padding:42px 40px; gap:26px; }
.picnic-intro-character { width:32%; height:330px; flex-shrink:0; margin-left:20px; animation:picnic-breathe 3.5s ease-in-out infinite; transform-origin:50% 100%; }
.picnic-story-card { width:56%; border:1px solid #fffdf1; border-radius:20px; padding:28px; background:#fffcf0ef; box-shadow:0 12px 35px #49603b20; }
.picnic-story-card h1 { font-size:30px; margin-top:10px; }
.picnic-narration-en { font:700 18px/1.7 "Quicksand",sans-serif; color:#536a44; margin:12px 0; }
.picnic-narration-zh { font-size:12px; color:#7d886b; margin:8px 0; }
.picnic-narration>.picnic-eyebrow { display:none; }
.picnic-plan { display:flex; flex-wrap:wrap; gap:8px; margin:20px 0 24px; }
.picnic-plan>span { padding:6px 9px; border-radius:7px; background:#eaf0dc; color:#819264; font-size:10px; }
.picnic-chapter-title { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:24px 0; }
.picnic-chapter-title p { color:#899275; font-size:12px; margin:0; }
.picnic-chapter-title h1 { font-size:32px; margin:8px 0; }
.picnic-round-dots { display:flex; gap:10px; flex-shrink:0; }
.picnic-round-dots i { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; font:700 12px "Quicksand",sans-serif; color:#a6ad90; border:1px dashed #cfd3bf; }
.picnic-round-dots .current { border:2px solid #a8b780; background:#f2edcf; color:#70824e; }
.picnic-round-dots .done { background:#7b915c; color:#fff; border-color:#7b915c; }
.picnic-game-layout { display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:26px; }
.picnic-world { position:relative; min-height:500px; border-radius:22px; padding:52px 20px 70px; overflow:hidden; isolation:isolate; border:1px solid #d8e0c7; display:flex; flex-direction:column; justify-content:flex-end; }
.picnic-world::before { content:""; position:absolute; inset:30% 0 0; z-index:-1; background:linear-gradient(transparent,#f0efcce0 92%); }
.picnic-scene-sign { position:absolute; top:18px; left:50%; transform:translateX(-50%) rotate(-2deg); font-size:11px; color:#7b855b; border:1px solid #e3dcbb; border-radius:8px; background:#fff9e9ef; padding:9px 20px; white-space:nowrap; box-shadow:0 4px 0 #596e3220; }
.picnic-delivery-scene { display:flex; align-items:flex-end; justify-content:center; gap:34px; position:relative; min-height:230px; margin:32px 0 22px; }
.picnic-live-friend { position:relative; width:155px; height:220px; transform-origin:50% 100%; animation:picnic-breathe 4s ease-in-out infinite; }
.picnic-speech { position:absolute; top:-30px; left:50%; transform:translateX(-50%); font:700 11px/1.6 "Quicksand","Microsoft YaHei",sans-serif; border-radius:14px 14px 0; background:#fffdf0; padding:9px 14px; color:#738353; white-space:nowrap; box-shadow:0 4px 14px #4a603724; }
.picnic-sharing .picnic-speech { font-size:12px; }
.picnic-dropzone { position:relative; width:138px; height:155px; border:2px dashed #a2ad77; border-radius:24px; background:#fff5d438; padding:12px; display:flex; align-items:center; justify-content:center; flex-direction:column; color:#677d4b; cursor:pointer; }
.picnic-dropzone>.picnic-piece { width:90px; height:105px; }
.picnic-dropzone>span:last-child { font-size:10px; white-space:nowrap; padding:5px 8px; border-radius:10px; background:#fff8e6ee; }
.picnic-dropzone.is-ready,.picnic-dropzone.is-over { background:#fff1a9b0; border-color:#829754; box-shadow:0 0 0 5px #f8e98766; }
.picnic-dropzone.is-over { transform:scale(1.08); }
.picnic-dropzone:disabled { cursor:default; }
.picnic-plate { width:100px; height:60px; display:block; border-radius:50%; margin:20px 0; background:radial-gradient(ellipse,#faf3da 0 48%,#d7c696 50% 57%,#fffcee 59% 75%,#c8b77d 78%); box-shadow:0 7px 1px #8e854c28; }
.picnic-delivered { position:absolute; top:20px; left:30px; width:70px; height:70px; animation:picnic-arrive .5s ease-out; }
.picnic-sharing .picnic-delivered { animation:picnic-eaten 1.1s ease-in-out both; }
.picnic-live-friend.is-happy { animation:picnic-jump .55s ease-in-out 2; }
.picnic-food-tray { display:flex; justify-content:center; gap:12px; background:#fff9e9e8; border:1px solid #e3d6b7; border-bottom:6px solid #cdbb8e; border-radius:20px; padding:12px; box-shadow:0 8px 24px #586a3c12; }
.picnic-choice { cursor:pointer; }
.picnic-food { width:104px; height:112px; border-radius:14px; padding:8px; background:transparent; border:2px solid transparent; touch-action:none; user-select:none; color:#7b8c5d; transition:transform .2s; }
.picnic-food>.picnic-piece { width:72px; height:72px; margin:auto; filter:drop-shadow(0 4px 2px #71612d22); }
.picnic-food small { font:11px "Quicksand","Microsoft YaHei",sans-serif; display:block; margin-top:5px; }
.picnic-food:hover:not(:disabled) { transform:translateY(-6px) rotate(-4deg); background:#fffdf6; }
.picnic-food.is-selected,.picnic-food.picnic-hinted { background:#fbf0b9; border-color:#a2b075; }
.picnic-food:disabled { cursor:default; }
.picnic-food.is-packed { opacity:.3; }
.picnic-food.is-dragging { opacity:.15; }
.picnic-pocket { position:absolute; bottom:14px; left:16px; right:16px; display:flex; align-items:center; justify-content:center; gap:10px; color:#829164; font-size:10px; }
.picnic-pocket>span:not(:first-child) { display:block; width:28px; height:32px; border-radius:6px; background:#fffcf0bb; padding:2px; }
.picnic-pocket>b { font:700 12px "Quicksand",sans-serif; padding-left:6px; }
.picnic-game-coach { align-self:center; padding:20px 4px; min-width:0; }
.picnic-coach-avatar { display:block; width:65px; height:85px; margin:20px auto; }
.picnic-game-coach .picnic-prompt { font:700 21px/1.6 "Quicksand",sans-serif; color:#526d43; min-height:65px; margin:16px 0; }
.picnic-game-coach>.picnic-button { width:100%; min-height:44px; }
.picnic-game-coach>[data-picnic=prompt] { background:#5d774d; color:#fff8e7; border-color:#5d774d; }
.picnic-feedback { font-size:12px; color:#7a8568; line-height:1.8; min-height:60px; margin:18px 0 12px; }
.picnic-gesture-tip { font-size:10px; color:#a1a68d; margin-top:14px; }
.picnic-auto-next { font-size:12px; color:#8f9a73; }
.picnic-forest-search { display:flex; justify-content:center; gap:10px; margin:100px 0 55px; }
.picnic-bush { width:32%; height:205px; position:relative; border:0; border-radius:0; background:none; isolation:isolate; }
.picnic-hidden-friend { position:absolute; left:15%; bottom:6px; width:70%; height:160px; transform:translateY(70px) scale(.75); opacity:0; transition:transform .5s cubic-bezier(.2,.7,.3,1.3),opacity .25s; }
.picnic-bush.is-revealed .picnic-hidden-friend { transform:translateY(-30px) scale(1); opacity:1; }
.picnic-bush.is-found .picnic-hidden-friend { animation:picnic-pop .6s ease-out; }
.picnic-leaves { position:absolute; left:-5%; right:-5%; bottom:10px; height:105px; filter:drop-shadow(0 5px 4px #49632b30); transition:transform .4s; }
.picnic-leaves i { position:absolute; left:0; bottom:0; width:55%; height:70%; border-radius:65% 50% 20% 50%; transform:rotate(-20deg); background:linear-gradient(130deg,#b1c485,#709356); border-top:2px solid #ced99d; }
.picnic-leaves i:nth-child(2) { left:20%; bottom:20%; background:linear-gradient(120deg,#bbcc89,#8caa61); transform:rotate(20deg); }
.picnic-leaves i:nth-child(3) { left:48%; background:linear-gradient(140deg,#91ae6a,#5e8050); transform:rotate(40deg); }
.picnic-leaves i:nth-child(4) { left:10%; width:50%; background:linear-gradient(150deg,#b5c985,#719653); transform:rotate(15deg); }
.picnic-leaves i:nth-child(5) { left:40%; height:50%; background:linear-gradient(160deg,#c7d69c,#89a860); }
.picnic-bush.is-revealed .picnic-leaves { transform:translateY(25px) scaleY(.65); }
.picnic-bush-label { position:absolute; bottom:-22px; left:50%; transform:translateX(-50%); font:11px/1.5 "Quicksand","Microsoft YaHei",sans-serif; white-space:nowrap; padding:5px 10px; background:#fff9e9e8; color:#7c9060; border-radius:20px; }
.picnic-bush.picnic-hinted { filter:drop-shadow(0 0 12px #ffef8a); }
.picnic-bush:disabled { cursor:default; opacity:1; }
.picnic-bridge { min-height:580px; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; padding:24px 30px; }
.picnic-bridge::before,.picnic-goodbye::before { background:linear-gradient(transparent 30%,#f6f4ded4 70%); }
.picnic-bridge-bear { width:190px; height:255px; margin:30px auto 12px; animation:picnic-jump 1s ease-in-out 2; }
.picnic-friend-group { display:flex; align-items:flex-end; justify-content:center; gap:18px; width:85%; margin:55px auto 20px; }
.picnic-friend-group>span { display:block; width:20%; height:210px; }
.picnic-friend-group>span:first-child { height:235px; }
.picnic-bridge-message { text-align:center; background:#fffdf0e8; border:1px solid #fffdf2; border-radius:20px; padding:22px 36px; width:min(100%,660px); margin:0 auto; }
.picnic-bridge-message h1 { font-size:29px; margin:10px 0; }
.picnic-bridge-message .picnic-narration-en { font-size:18px; margin:10px 0; }
.picnic-bridge-message .picnic-narration-zh { font-size:12px; }
.picnic-goodbye { display:flex; flex-direction:column; align-items:center; justify-content:flex-end; padding:30px; min-height:560px; }
.picnic-goodbye .picnic-friend-group { animation:picnic-breathe 3s ease-in-out infinite; }
.picnic-ending { position:relative; padding:30px 18px; text-align:center; border-radius:22px; background:radial-gradient(ellipse at 50% 45%,#f5ecd2,#f7f8ed 75%); overflow:hidden; }
.picnic-ending>h1 { font-size:40px; margin:16px 0; }
.picnic-ending>p { font-size:13px; color:#8b9478; }
.picnic-final-seal { width:100%; height:250px; display:flex; justify-content:center; align-items:center; position:relative; margin-top:14px; }
.picnic-final-seal>.picnic-sprout-stamp { z-index:1; animation:picnic-seal 1s 1s cubic-bezier(.15,.8,.2,1.2) both; }
.picnic-final-stamps { display:flex; justify-content:center; gap:25px; margin:26px auto; }
.picnic-ending-buttons { display:flex; justify-content:center; gap:12px; margin-top:30px; }
.picnic-ending-buttons>.picnic-button:first-child { background:#5a764d; color:#fff9e5; border-color:#5a764d; }
.picnic-confetti { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.picnic-confetti i { position:absolute; left:calc(var(--n) * 10%); top:50%; color:var(--color); font-size:22px; animation:picnic-confetti 1.2s calc(var(--n) * .025s) ease-out both; font-style:normal; }
.picnic-fireworks { overflow:visible; }
.picnic-fireworks i { left:calc(mod(var(--n),12) * 8.3%); top:15%; font-size:16px; animation:picnic-fireworks 2.8s calc(var(--n) * .025s) ease-out both; }
.picnic-paused,.picnic-audio-error { padding:14px 20px; border-radius:14px; background:#f5edce; color:#8c805d; margin-top:20px; font-size:12px; }
.picnic-audio-error { display:flex; align-items:center; justify-content:center; gap:12px; }
.picnic-drag-ghost { position:fixed; z-index:9999; width:80px; height:80px; pointer-events:none; transform:translate(-50%,-65%) rotate(-8deg); filter:drop-shadow(0 10px 8px #37412455); }
.is-wobbling .picnic-delivery-scene { animation:picnic-no .4s ease-out; }
@keyframes picnic-breathe { 50% { transform:rotate(2deg) translateY(-3px); } }
@keyframes picnic-jump { 50% { transform:translateY(-14px) rotate(-4deg); } }
@keyframes picnic-arrive { from { opacity:0; transform:translateY(-45px) scale(.5); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes picnic-eaten { 0% { transform:scale(.3); } 35% { transform:translate(-70px,-45px) scale(1); } 100% { opacity:0; transform:translate(-90px,-60px) scale(0); } }
@keyframes picnic-pop { from { opacity:0; transform:translateY(50px) scale(.6); } 70% { transform:translateY(-45px); } to { transform:translateY(-30px); opacity:1; } }
@keyframes picnic-no { 25%,75% { transform:translateX(-5px); } 50% { transform:translateX(5px); } }
@keyframes picnic-seal { from { opacity:0; transform:scale(1.8) rotate(-25deg); } 70% { opacity:1; transform:scale(.95) rotate(-10deg); } to { opacity:1; transform:scale(1) rotate(-10deg); } }
@keyframes picnic-confetti { from { opacity:0; transform:translateY(0) rotate(0); } 25% { opacity:1; } to { opacity:0; transform:translateY(-150px) rotate(120deg); } }
@keyframes picnic-fireworks { from { opacity:0; transform:translateY(70px) scale(.2); } 20% { opacity:1; } to { opacity:0; transform:translateY(-130px) rotate(220deg) scale(1.3); } }
@media(max-width:900px) {
  .picnic-word-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .picnic-game-layout { grid-template-columns:minmax(0,1fr) 210px; gap:18px; }
  .picnic-start-card { padding:22px; }
  .picnic-intro { padding:26px; gap:18px; }
  .picnic-story-card { padding:22px; }
  .picnic-story-card h1 { font-size:26px; }
}
@media(max-width:700px) {
  .picnic-app { padding:0 10px 24px; }
  .picnic-topbar { min-height:60px; font-size:11px; gap:8px; }
  .picnic-brand { display:none; }
  .picnic-topbar button { font-size:10px; padding:8px; }
  .picnic-paper { padding:16px; border-radius:22px; }
  .picnic-unit-hero { min-height:370px; padding:30px 22px 165px; border-radius:16px; }
  .picnic-unit-hero>img { object-position:40% center; }
  .picnic-unit-title h1 { font-size:32px; }
  .picnic-unit-title p { font-size:11px; }
  .picnic-unit-title .picnic-eyebrow { font-size:8px; letter-spacing:1px; }
  .picnic-stamp-album { left:10px; right:10px; bottom:10px; padding:12px 8px; gap:8px; align-items:flex-start; flex-direction:column; }
  .picnic-stamp-album>span { font-size:9px; }
  .picnic-stamp-album>span b { font-size:12px; display:inline; padding-left:8px; }
  .picnic-stamp-album>div { justify-content:space-around; width:100%; gap:8px; }
  .picnic-unit-stamp { width:58px; height:58px; padding:6px 8px 15px; }
  .picnic-unit-stamp>.picnic-piece,.picnic-unit-stamp>.picnic-animal { width:30px; height:30px; }
  .picnic-unit-stamp small { font-size:6px; }
  .picnic-stamp-album .picnic-sprout-stamp { width:58px; height:58px; padding:6px; }
  .picnic-stamp-album .picnic-sprout-stamp>svg { width:22px; height:22px; }
  .picnic-stamp-album .picnic-sprout-stamp b { font-size:7px; }
  .picnic-stamp-album .picnic-sprout-stamp small { font-size:5px; }
  .picnic-section-heading { display:block; }
  .picnic-section-heading h2 { font-size:21px; }
  .picnic-section-heading p { font-size:11px; margin-top:6px; }
  .picnic-vocabulary { margin:28px 0; }
  .picnic-word-grid { gap:8px; }
  .picnic-word-card { padding:14px 6px; border-radius:14px; }
  .picnic-word-art { width:45px; height:56px; margin-bottom:8px; }
  .picnic-word-card strong { font-size:13px; }
  .picnic-word-card>small { font-size:10px; }
  .picnic-start-card { display:block; padding:20px; }
  .picnic-start-card h2 { font-size:20px; }
  .picnic-start-card>.picnic-button { width:100%; margin-top:22px; }
  .picnic-levels { flex-wrap:wrap; }
  .picnic-journey { gap:4px; padding:4px 0 20px; margin-bottom:20px; }
  .picnic-journey>span { font-size:7px; gap:7px; }
  .picnic-journey i { width:24px; height:24px; font-size:9px; }
  .picnic-story-scene { min-height:0; border-radius:18px; }
  .picnic-intro { flex-direction:column; gap:0; padding:20px 14px; }
  .picnic-intro-character { width:145px; height:210px; margin:0 auto 12px; }
  .picnic-story-card { width:100%; padding:22px; }
  .picnic-story-card h1 { font-size:24px; }
  .picnic-narration-en { font-size:16px; }
  .picnic-narration-zh { font-size:11px; }
  .picnic-plan { gap:5px; margin:16px 0 20px; }
  .picnic-plan>span { font-size:8px; padding:6px; }
  .picnic-story-card>.picnic-button { width:100%; font-size:12px; }
  .picnic-chapter-title { gap:10px; margin:18px 0; }
  .picnic-chapter-title h1 { font-size:25px; margin:7px 0; }
  .picnic-chapter-title p { font-size:10px; }
  .picnic-chapter-title .picnic-eyebrow { font-size:8px; letter-spacing:1px; }
  .picnic-round-dots { gap:5px; }
  .picnic-round-dots i { width:24px; height:24px; font-size:10px; }
  .picnic-game-layout { display:flex; flex-direction:column; gap:16px; }
  .picnic-world { min-height:390px; padding:35px 10px 55px; border-radius:18px; }
  .picnic-delivery-scene { gap:18px; min-height:180px; margin:38px 0 18px; }
  .picnic-live-friend { width:110px; height:165px; }
  .picnic-speech { font-size:9px; padding:8px 10px; top:-25px; }
  .picnic-sharing .picnic-speech { font-size:9px; max-width:155px; white-space:normal; min-width:140px; text-align:center; }
  .picnic-dropzone { width:95px; height:120px; border-radius:18px; padding:6px; }
  .picnic-dropzone>.picnic-piece { width:65px; height:80px; }
  .picnic-dropzone>span:last-child { font-size:8px; padding:5px; }
  .picnic-plate { width:75px; height:45px; margin:20px 0 14px; }
  .picnic-delivered { width:50px; height:50px; left:20px; top:20px; }
  .picnic-food-tray { padding:8px 4px; gap:4px; border-radius:16px; }
  .picnic-food { width:33%; height:84px; padding:4px; }
  .picnic-food>.picnic-piece { width:53px; height:53px; }
  .picnic-food small { font-size:9px; }
  .picnic-pocket { gap:6px; font-size:8px; }
  .picnic-pocket>span:not(:first-child) { width:23px; height:27px; }
  .picnic-game-coach { display:flex; flex-wrap:wrap; gap:10px; align-items:center; padding:16px; border:1px solid #e4e7d7; border-radius:16px; background:#f7f8ed; }
  .picnic-game-coach>.picnic-eyebrow { display:none; }
  .picnic-coach-avatar { width:36px; height:50px; margin:0; }
  .picnic-game-coach .picnic-prompt { flex:1; min-height:0; font-size:16px; margin:0; }
  .picnic-game-coach>[data-picnic=prompt] { width:auto; min-height:38px; font-size:10px; padding:9px; }
  .picnic-feedback { width:100%; margin:4px 0; min-height:0; font-size:11px; }
  .picnic-game-coach>[data-picnic=hint] { width:auto; min-height:36px; font-size:10px; padding:8px 12px; }
  .picnic-gesture-tip { flex:1; min-width:110px; margin:0; font-size:9px; }
  .picnic-auto-next { font-size:10px; }
  .picnic-forest-search { gap:4px; margin:100px 0 65px; }
  .picnic-bush { height:155px; }
  .picnic-hidden-friend { left:10%; width:80%; height:125px; }
  .picnic-leaves { height:75px; }
  .picnic-bush-label { font-size:9px; padding:4px 6px; }
  .picnic-bridge,.picnic-goodbye { padding:20px 12px; min-height:480px; }
  .picnic-bridge-bear { width:145px; height:205px; margin-top:10px; }
  .picnic-bridge-message { padding:20px 16px; }
  .picnic-bridge-message h1 { font-size:23px; }
  .picnic-bridge-message .picnic-narration-en { font-size:15px; }
  .picnic-bridge-message .picnic-narration-zh { font-size:11px; }
  .picnic-friend-group { width:100%; gap:3px; margin:40px auto 20px; }
  .picnic-friend-group>span { width:24%; height:110px; }
  .picnic-friend-group>span:first-child { height:125px; }
  .picnic-ending { padding:30px 12px; }
  .picnic-ending>h1 { font-size:30px; }
  .picnic-ending>p { font-size:11px; }
  .picnic-ending>.picnic-eyebrow { font-size:8px; letter-spacing:1px; }
  .picnic-final-seal { height:230px; }
  .picnic-ending-buttons { flex-direction:column; }
  .picnic-ending-buttons>.picnic-button { font-size:12px; }
  .picnic-final-stamps { gap:20px; }
  .picnic-footer { font-size:8px; letter-spacing:1px; }
}
@media(prefers-reduced-motion:reduce) {
  .picnic-app *,.picnic-drag-ghost { animation:none!important; transition:none!important; }
}
/* The story is the canvas; controls stay at the edges of the picture. */
.picnic-paper { padding:24px; background:#fffcf3; }
.picnic-topbar { min-height:60px; opacity:.85; }
.picnic-brand { font-size:12px; letter-spacing:1px; }
.picnic-footer { margin-top:20px; font-size:8px; opacity:.65; }
.picnic-story-cover { min-height:540px; padding:58px 44px 50px; display:flex; align-items:center; }
.picnic-story-cover::before { background:linear-gradient(90deg,#193f32d9, #1f463c43 60%,transparent); }
.picnic-story-cover .picnic-unit-title h1 { font-size:54px; margin:20px 0; letter-spacing:3px; }
.picnic-story-cover .picnic-unit-title p { font-size:14px; line-height:2; color:#f7f1da; }
.picnic-story-cover .picnic-unit-title>.picnic-button { margin-top:24px; background:#f2db9e; color:#42613e; border-color:#f2db9e; box-shadow:0 4px 0 #aa945b; }
.picnic-cover-spine { position:absolute; bottom:24px; left:44px; letter-spacing:4px; font:9px "Quicksand",sans-serif; color:#e2e6c1; }
.picnic-keepsakes { display:flex; align-items:center; justify-content:space-between; gap:18px; border-bottom:1px dashed #e4e5d2; padding:22px 16px; }
.picnic-keepsakes>span { font-size:12px; color:#93977e; }
.picnic-keepsakes>div { display:flex; align-items:center; gap:16px; }
.picnic-keepsakes .picnic-unit-stamp { width:58px; height:58px; padding:7px 8px 16px; }
.picnic-keepsakes .picnic-unit-stamp>.picnic-piece,.picnic-keepsakes .picnic-unit-stamp>.picnic-animal { width:30px; height:30px; }
.picnic-keepsakes .picnic-unit-stamp small { font-size:6px; }
.picnic-keepsakes .picnic-sprout-stamp { width:64px; height:64px; padding:5px; border-width:3px; }
.picnic-keepsakes .picnic-sprout-stamp>svg { width:24px; height:24px; }
.picnic-keepsakes .picnic-sprout-stamp b { font-size:7px; letter-spacing:1px; }
.picnic-keepsakes .picnic-sprout-stamp small { font-size:5px; letter-spacing:0; margin-top:2px; }
.picnic-vocabulary { margin:22px 0; }
.picnic-vocabulary summary { cursor:pointer; color:#77896a; padding:8px 12px; }
.picnic-vocabulary summary>span { font-size:13px; }
.picnic-vocabulary summary>small { display:block; color:#aaa994; font-size:10px; padding:8px 0 0 14px; }
.picnic-vocabulary .picnic-word-grid { padding-top:18px; }
.picnic-parent { margin-top:12px; padding:18px 12px 0; }
.picnic-book-running-title { display:flex; justify-content:space-between; align-items:center; color:#a6ab91; font-size:10px; padding:2px 12px 18px; }
.picnic-book-running-title>i { font-style:normal; color:#c9be8e; font-size:10px; }
.picnic-story-scene { min-height:600px; border-radius:16px; }
.picnic-character-touch { background:none; padding:0; border:0; cursor:pointer; color:#8c9b74; }
.picnic-intro { padding:50px 40px; }
.picnic-intro-character { position:relative; width:33%; height:365px; margin:0; }
.picnic-intro-character>span:last-child:not(.picnic-animal) { position:absolute; bottom:-18px; left:50%; transform:translateX(-50%); color:#8c956f; background:#fff9e4dc; padding:6px 12px; white-space:nowrap; border-radius:20px; font-size:10px; }
.picnic-intro-character.is-waving { animation:picnic-jump .65s ease-in-out; }
.picnic-story-card { width:55%; background:#fffcf0dd; border:0; box-shadow:none; padding:28px; border-radius:8px 24px 24px; }
.picnic-story-card h1 { font-size:32px; line-height:1.6; }
.picnic-story-card .picnic-narration-en { font-size:22px; line-height:1.8; }
.picnic-story-card .picnic-narration-zh { font-size:14px; line-height:2; }
.picnic-story-card>.picnic-button { margin-top:18px; font-size:13px; }
.picnic-butterfly { position:absolute; top:12%; left:38%; z-index:2; padding:10px; border:0; background:none; cursor:pointer; font-size:32px; color:#bba354; animation:picnic-butterfly 4s ease-in-out infinite; }
.picnic-book-page { border-radius:18px; overflow:hidden; border:1px solid #e1e7d1; box-shadow:0 10px 30px #5e693a0a; background:#f6f4e7; animation:picnic-page-open .65s ease-out; }
.picnic-book-page>.picnic-world { border:0; border-radius:0; min-height:610px; padding:40px 40px 74px; }
.picnic-world::before { inset:45% 0 0; background:linear-gradient(transparent,#edf0caab); }
.picnic-book-page .picnic-delivery-scene { min-height:290px; gap:65px; margin:40px 0 24px; }
.picnic-book-page .picnic-live-friend { width:195px; height:280px; }
.picnic-book-page .picnic-dropzone { width:165px; height:185px; background:#fff8db2b; border-color:#c1c78c; }
.picnic-book-page .picnic-dropzone>.picnic-piece { width:112px; height:136px; }
.picnic-book-page .picnic-food-tray { align-self:center; width:min(100%,580px); padding:12px 26px; border-radius:50% 50% 20px 20px / 18px 18px 20px 20px; background:#fdf8e4db; border:1px solid #e5d6a6; border-bottom:7px solid #c5b47c; box-shadow:0 6px 18px #6e622d18; gap:25px; }
.picnic-book-page .picnic-food { width:120px; height:110px; }
.picnic-book-page .picnic-food.is-packed { visibility:hidden; }
.picnic-story-line { text-align:center; padding:22px 40px 26px; min-height:128px; background:#fffcf2; border-top:1px solid #e8e6ce; }
.picnic-line-en { font:700 24px/1.65 "Quicksand",sans-serif; color:#60784c; margin:0 0 8px; }
.picnic-line-zh { font-size:13px; line-height:1.9; color:#8d957a; margin:0; }
.picnic-in-picture-tools { position:absolute; right:16px; bottom:14px; display:flex; gap:6px; z-index:3; }
.picnic-in-picture-tools>.picnic-button { width:35px; height:35px; min-height:35px; padding:0; border-radius:50%; background:#fff9e7dd; border-color:#e0dfbe; color:#899a6b; font-size:14px; }
.picnic-pocket { bottom:22px; left:20px; right:auto; justify-content:flex-start; opacity:.85; }
.picnic-forest-search { width:85%; align-self:center; gap:34px; margin:160px 0 50px; }
.picnic-bush { height:240px; }
.picnic-hidden-friend { height:200px; }
.picnic-leaves { height:125px; }
.picnic-bush-label { font-size:11px; bottom:-24px; }
.picnic-table-scene { position:relative; width:min(100%,800px); margin:90px auto 10px; }
.picnic-guests { display:flex; align-items:flex-end; justify-content:center; gap:35px; padding:0 30px; position:relative; z-index:1; }
.picnic-guest { position:relative; display:block; width:150px; height:205px; background:none; padding:0; border:0; cursor:pointer; transform-origin:50% 100%; transition:transform .3s; }
.picnic-guest.is-talking { transform:translateY(-7px); }
.picnic-guest.is-talking::after { content:""; position:absolute; bottom:-6px; left:10%; width:80%; height:12px; border-radius:50%; background:#e8db9133; }
.picnic-guest .picnic-speech { font-size:13px; top:-42px; max-width:230px; white-space:normal; min-width:180px; text-align:center; padding:10px 14px; }
.picnic-guest-invite,.picnic-contented { position:absolute; left:50%; top:-22px; transform:translateX(-50%); background:#fff9e3e6; border-radius:16px; padding:5px 10px; font-size:10px; color:#8c9d6b; white-space:nowrap; }
.picnic-contented { color:#a7a275; }
.picnic-guest.is-fed { animation:picnic-breathe 4s ease-in-out infinite; }
.picnic-gingham { min-height:110px; width:86%; margin:-18px auto 0; position:relative; border:1px solid #e7c1a5; border-radius:50%; background:repeating-linear-gradient(90deg,#f4dcc5aa 0 18px,#fffae8c9 18px 36px),repeating-linear-gradient(0deg,#e8c4ab 0 18px,#fff4db 18px 36px); transform:perspective(500px) rotateX(20deg); box-shadow:0 7px 12px #6c653016; }
.picnic-book-page .picnic-table-drop { min-height:88px; width:130px; height:100px; margin:0 auto; padding:3px 8px; border:1px dashed #b4b98788; border-radius:50%; background:#fff9e822; transform:translateX(0); }
.picnic-table-drop .picnic-plate { margin:6px 0; }
.picnic-table-drop>span:last-child { font-size:10px; }
.picnic-table-drop .picnic-delivered { top:0; left:28px; }
.picnic-world-share.is-success .picnic-guest.is-talking { animation:picnic-jump .55s ease-in-out 2; }
.picnic-world-share.is-success .picnic-delivered { animation:picnic-eaten 1.1s ease-in-out both; }
.picnic-turning-page { animation:picnic-page-open .7s ease-out; }
.picnic-bridge-message { border:0; border-radius:8px; background:#fffcf0d9; box-shadow:none; }
.picnic-bridge-message .picnic-narration-en { font-size:24px; }
.picnic-bridge-message .picnic-narration-zh { font-size:14px; line-height:2; }
.picnic-little-path { font-size:70px; color:#d7c694; letter-spacing:25px; margin-top:-18px; }
.picnic-goodbye .picnic-scene-landscape { filter:sepia(.2) saturate(.8); }
.picnic-setting-sun { position:absolute; top:14%; right:18%; width:70px; height:70px; border-radius:50%; background:#e9c28755; box-shadow:0 0 70px #efc78388; z-index:-1; }
.picnic-goodbye-note { font-size:11px; color:#a1a58a; }
.picnic-memory-ending { background:#f6f3e5; padding:32px 30px; }
.picnic-memory-ending>h1 { font-size:38px; color:#657a4e; }
.picnic-memory-photo { position:relative; isolation:isolate; width:min(100%,700px); height:390px; padding:35px 35px 65px; margin:36px auto 55px; background:#fffdf2; border:12px solid #fffdf2; border-bottom:44px solid #fffdf2; box-shadow:0 10px 25px #776e3e20; transform:rotate(-2deg); }
.picnic-memory-photo>.picnic-scene-landscape { z-index:-1; }
.picnic-memory-photo .picnic-friend-group { width:90%; margin:15px auto 0; gap:10px; }
.picnic-memory-photo .picnic-friend-group>span { height:205px; width:24%; }
.picnic-memory-photo .picnic-friend-group>span:first-child { height:215px; }
.picnic-photo-food { display:flex; justify-content:center; gap:20px; margin:0 auto; padding:8px; width:80%; background:#f8ead6b3; border-radius:50%; }
.picnic-photo-food>span { display:block; width:42px; height:42px; }
.picnic-photo-caption { position:absolute; left:0; right:0; bottom:-29px; font-size:11px; color:#919a7a; }
.picnic-memory-photo .picnic-final-seal { position:absolute; bottom:-55px; right:-35px; width:130px; height:130px; margin:0; transform:rotate(14deg); }
.picnic-memory-photo .picnic-sprout-stamp { width:125px; height:125px; padding:14px; border-width:4px; background:#f2ecd8df; }
.picnic-memory-photo .picnic-sprout-stamp>svg { width:48px; height:48px; }
.picnic-memory-photo .picnic-sprout-stamp>b { font-size:13px; letter-spacing:2px; }
.picnic-memory-photo .picnic-sprout-stamp>small { font-size:8px; letter-spacing:1px; margin-top:4px; }
@keyframes picnic-page-open { from { opacity:.7; transform:translateX(12px); } to { opacity:1; transform:translateX(0); } }
@keyframes picnic-butterfly { 50% { transform:translate(10px,-10px) rotate(10deg); } }
@media(max-width:700px) {
 .picnic-paper { padding:12px; }
 .picnic-story-cover { min-height:500px; padding:50px 24px 60px; align-items:flex-end; }
 .picnic-story-cover::before { background:linear-gradient(0deg,#1c4635e8,transparent); }
 .picnic-story-cover .picnic-unit-title h1 { font-size:34px; }
 .picnic-story-cover .picnic-unit-title p { font-size:12px; }
 .picnic-story-cover .picnic-unit-title>.picnic-button { padding:12px 15px; font-size:11px; margin-top:18px; }
 .picnic-cover-spine { left:24px; bottom:22px; font-size:8px; letter-spacing:2px; }
 .picnic-keepsakes { display:block; padding:20px 4px; }
 .picnic-keepsakes>span { font-size:10px; }
 .picnic-keepsakes>div { margin-top:14px; justify-content:center; gap:16px; }
 .picnic-book-running-title { font-size:8px; padding:4px 4px 14px; }
 .picnic-book-running-title>span:last-child { max-width:48%; text-align:right; }
 .picnic-story-scene { min-height:0; }
 .picnic-intro { padding:20px 14px; }
 .picnic-intro-character { width:145px; height:220px; margin:10px auto 25px; }
 .picnic-intro-character>span:last-child:not(.picnic-animal) { font-size:8px; bottom:-12px; }
 .picnic-story-card { width:100%; padding:20px; }
 .picnic-story-card h1 { font-size:25px; }
 .picnic-story-card .picnic-narration-en { font-size:19px; }
 .picnic-story-card .picnic-narration-zh { font-size:12px; }
 .picnic-butterfly { left:auto; right:15%; top:10%; font-size:26px; }
 .picnic-book-page>.picnic-world { min-height:460px; padding:20px 10px 60px; }
 .picnic-book-page .picnic-delivery-scene { min-height:220px; gap:20px; margin:48px 0 18px; }
 .picnic-book-page .picnic-live-friend { width:115px; height:190px; }
 .picnic-book-page .picnic-dropzone { width:105px; height:130px; }
 .picnic-book-page .picnic-dropzone>.picnic-piece { width:74px; height:95px; }
 .picnic-book-page .picnic-dropzone>span:last-child { font-size:7px; }
 .picnic-book-page .picnic-food-tray { gap:5px; padding:10px 5px; }
 .picnic-book-page .picnic-food { width:31%; height:80px; }
 .picnic-story-line { padding:20px 16px; min-height:120px; }
 .picnic-line-en { font-size:20px; }
 .picnic-line-zh { font-size:12px; }
 .picnic-pocket { bottom:22px; left:10px; gap:5px; }
 .picnic-pocket>span:first-child { font-size:7px; }
 .picnic-pocket>span:not(:first-child) { width:20px; height:24px; }
 .picnic-in-picture-tools { right:10px; bottom:14px; }
 .picnic-in-picture-tools>.picnic-button { width:28px; min-height:28px; height:28px; font-size:12px; }
 .picnic-forest-search { width:100%; gap:4px; margin:150px 0 65px; }
 .picnic-bush { height:155px; }
 .picnic-hidden-friend { height:130px; }
 .picnic-leaves { height:78px; }
 .picnic-bush-label { font-size:8px; padding:5px; }
 .picnic-table-scene { margin:90px auto 12px; }
 .picnic-guests { padding:0 0; gap:8px; }
 .picnic-guest { width:28%; height:130px; }
 .picnic-guest .picnic-speech { min-width:102px; max-width:120px; font-size:9px; top:-46px; padding:8px; }
 .picnic-guest-invite,.picnic-contented { font-size:8px; padding:4px 6px; top:-24px; }
 .picnic-gingham { min-height:90px; width:95%; margin-top:-8px; }
 .picnic-book-page .picnic-table-drop { width:110px; height:88px; min-height:80px; padding:3px; }
 .picnic-table-drop .picnic-plate { width:75px; height:45px; margin:3px 0; }
 .picnic-table-drop>span:last-child { font-size:8px; }
 .picnic-bridge-message .picnic-narration-en { font-size:19px; }
 .picnic-bridge-message .picnic-narration-zh { font-size:12px; }
 .picnic-memory-ending { padding:28px 10px; }
 .picnic-memory-ending>h1 { font-size:28px; }
 .picnic-memory-photo { height:245px; padding:16px 8px 50px; border-width:7px; border-bottom-width:35px; margin:28px auto 50px; width:95%; }
 .picnic-memory-photo .picnic-friend-group { width:100%; margin:4px auto 0; gap:3px; }
 .picnic-memory-photo .picnic-friend-group>span { height:125px; }
 .picnic-memory-photo .picnic-friend-group>span:first-child { height:135px; }
 .picnic-photo-food { width:92%; gap:10px; padding:4px; }
 .picnic-photo-food>span { width:26px; height:26px; }
 .picnic-photo-caption { font-size:8px; bottom:-24px; }
 .picnic-memory-photo .picnic-final-seal { width:90px; height:90px; bottom:-48px; right:-12px; }
 .picnic-memory-photo .picnic-sprout-stamp { width:86px; height:86px; border-width:3px; padding:9px; }
 .picnic-memory-photo .picnic-sprout-stamp>svg { width:30px; height:30px; }
 .picnic-memory-photo .picnic-sprout-stamp>b { font-size:9px; letter-spacing:1px; }
 .picnic-memory-photo .picnic-sprout-stamp>small { font-size:6px; letter-spacing:0; }
}
@media(prefers-reduced-motion:reduce) {
 .picnic-app * { animation:none!important; transition:none!important; }
}
.picnic-intro-character,.picnic-intro-character.is-waving,.picnic-butterfly { animation:none; }
.picnic-intro-character>.picnic-animal { animation:picnic-breathe 3.5s ease-in-out infinite; }
.picnic-intro-character.is-waving>.picnic-animal { animation:picnic-jump .65s ease-in-out; }
.picnic-butterfly>span { display:block; animation:picnic-butterfly 4s ease-in-out infinite; }
.picnic-world-pack .picnic-food-tray { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; width:min(100%,740px); }
.picnic-world-pack .picnic-food { width:100%; }
.picnic-world-pack .picnic-food>.picnic-piece { width:64px; height:64px; }
@media(max-width:700px){
 .picnic-world-pack .picnic-food-tray { grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
 .picnic-world-pack .picnic-food { height:75px; }
 .picnic-world-pack .picnic-food>.picnic-piece { width:50px; height:50px; }
 .picnic-world-pack .picnic-pocket { max-width:calc(100% - 90px); flex-wrap:wrap; gap:3px; bottom:12px; }
 .picnic-world-pack .picnic-pocket>span:first-child { width:100%; }
}
/* Stable touch targets and a complete scene in the available screen height. */
.picnic-flight { position:fixed; left:0; top:0; width:78px; height:78px; z-index:9999; pointer-events:none; filter:drop-shadow(0 8px 6px #55603033); }
.picnic-book-page .picnic-live-friend { animation:none; }
.picnic-book-page .picnic-live-friend>.picnic-animal { animation:picnic-breathe 4s ease-in-out infinite; }
.picnic-book-page .picnic-live-friend.is-happy>.picnic-animal { animation:picnic-jump .55s ease-in-out; }
.picnic-guest.is-fed { animation:none; }
.picnic-guest.is-fed>.picnic-animal { animation:picnic-breathe 4s ease-in-out infinite; }
.picnic-book-page .picnic-food.is-packed { visibility:visible; opacity:.35; filter:grayscale(.45); }
.picnic-bag-count { position:absolute; top:-16px; right:-8px; min-width:44px; height:30px; display:grid; place-items:center; padding:0 8px; border-radius:20px; color:#fff9dd; background:#81985e; font:700 13px "Quicksand",sans-serif; box-shadow:0 3px 8px #4c693c22; }
.picnic-in-picture-tools>.picnic-button { width:44px; height:44px; min-height:44px; font-size:17px; }
.picnic-food.is-packed>small { color:#6a8051; font-size:10px; }
.picnic-food:not(:disabled) { cursor:grab; }
.picnic-food:not(:disabled):active { cursor:grabbing; }
@media(max-width:700px){
 .picnic-app:has(.picnic-book-page) { padding:0 8px 8px; }
 .picnic-app:has(.picnic-book-page) .picnic-topbar { min-height:44px; height:44px; }
 .picnic-app:has(.picnic-book-page) .picnic-paper { padding:8px; border-radius:18px; }
 .picnic-app:has(.picnic-book-page) .picnic-book-running-title { padding:3px 3px 10px; min-height:24px; }
 .picnic-app:has(.picnic-book-page) .picnic-footer { display:none; }
 .picnic-book-page>.picnic-world { height:min(550px,max(350px,calc(100svh - 175px))); min-height:0; padding:12px 10px 52px; justify-content:center; }
 .picnic-book-page .picnic-delivery-scene { height:clamp(145px,24svh,205px); min-height:0; gap:22px; margin:22px 0 12px; }
 .picnic-book-page .picnic-live-friend { width:110px; height:clamp(145px,23svh,190px); }
 .picnic-book-page .picnic-dropzone { width:126px; height:136px; border-width:2px; background:#fffbdf44; }
 .picnic-book-page .picnic-dropzone>.picnic-piece { width:86px; height:102px; }
 .picnic-book-page .picnic-dropzone>span:last-child { font-size:10px; background:#fff8def0; padding:6px 8px; }
 .picnic-world-pack .picnic-food-tray { grid-template-rows:repeat(2,70px); padding:7px 6px; gap:2px 7px; }
 .picnic-world-pack .picnic-food { height:70px; padding:3px; }
 .picnic-world-pack .picnic-food>.picnic-piece { width:46px; height:46px; }
 .picnic-food small { display:block; font-size:10px; margin-top:4px; }
 .picnic-story-line { min-height:82px; padding:12px 15px 14px; }
 .picnic-line-en { font-size:20px; margin-bottom:5px; }
 .picnic-line-zh { font-size:11px; line-height:1.65; }
 .picnic-in-picture-tools { bottom:7px; right:8px; gap:5px; }
 .picnic-in-picture-tools>.picnic-button { width:44px; height:44px; min-height:44px; font-size:17px; }
 .picnic-world-pack .picnic-pocket { max-width:calc(100% - 110px); bottom:7px; gap:2px; }
 .picnic-pocket>span:first-child { font-size:8px; }
 .picnic-pocket>span:not(:first-child) { width:20px; height:23px; }
 .picnic-world-find .picnic-forest-search { margin:auto auto 46px; width:100%; }
 .picnic-world-find .picnic-bush { height:155px; }
 .picnic-world-find .picnic-hidden-friend { height:130px; }
 .picnic-world-share .picnic-table-scene { margin:45px auto 9px; }
 .picnic-world-share .picnic-guests { gap:5px; }
 .picnic-world-share .picnic-guest { height:120px; }
 .picnic-book-page .picnic-table-drop { width:125px; height:83px; min-height:80px; }
 .picnic-world-share .picnic-food-tray { padding:7px; }
 .picnic-world-share .picnic-food { height:72px; }
 .picnic-world-share .picnic-food>.picnic-piece { width:50px; height:50px; }
}
@media(prefers-reduced-motion:reduce){
 .picnic-app *, .picnic-flight { animation:none!important;transition:none!important; }
}
@media(max-width:700px){
 .picnic-app:has(.picnic-book-page){padding-bottom:0;}
 .picnic-app:has(.picnic-book-page) .picnic-paper{padding-bottom:0;}
}
@media(min-width:701px){
 .picnic-book-page>.picnic-world{min-height:500px;height:min(610px,max(500px,calc(100svh - 360px)));padding:28px 30px 64px;}
 .picnic-book-page .picnic-delivery-scene{min-height:230px;margin:20px 0;}
 .picnic-book-page .picnic-live-friend{height:240px;}
}
.picnic-book-page .picnic-food.is-speaking { opacity:1;filter:none;background:#fcf1b9;box-shadow:0 0 0 2px #c7d49a,0 0 14px #f1d98077; }
.picnic-bush.is-speaking .picnic-hidden-friend { filter:drop-shadow(0 0 9px #ffe787); }
/* Mobile interaction areas stay fixed while the painted characters scale proportionally inside them. */
.picnic-app button,.picnic-app a { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
.picnic-food { touch-action:none!important; -webkit-touch-callout:none; }
.picnic-animal,.picnic-piece { -webkit-user-drag:none; user-select:none; -webkit-user-select:none; }
.picnic-topbar button,.picnic-topbar>a { min-width:44px; min-height:44px; }
.picnic-topbar>a { display:flex; align-items:center; }
.picnic-book-page { touch-action:pan-y pinch-zoom; }
.picnic-book-page .picnic-character-touch { animation:none; }
.picnic-animal { filter:drop-shadow(0 5px 3px #4d55251a); }
@media(max-width:700px){
 .picnic-world-find .picnic-bush { height:200px; }
 .picnic-world-find .picnic-hidden-friend { left:6%; width:88%; height:145px; bottom:14px; }
 .picnic-world-find .picnic-bush.is-found .picnic-hidden-friend { animation:none; }
 .picnic-world-find .picnic-bush.is-found .picnic-animal { animation:picnic-jump .55s ease-in-out; }
 .picnic-world-find .picnic-bush-label { min-height:30px; display:grid; place-items:center; font-size:10px; }
 .picnic-world-share .picnic-guest { min-width:60px; min-height:110px; }
 .picnic-world-share .picnic-guest-invite,.picnic-world-share .picnic-contented { font-size:9px; padding:6px 8px; }
}
@media(max-height:500px) and (orientation:landscape) and (pointer:coarse){
 .picnic-app:has(.picnic-book-page) { padding:0 8px; }
 .picnic-app:has(.picnic-book-page) .picnic-topbar { height:44px; min-height:44px; }
 .picnic-app:has(.picnic-book-page) .picnic-brand { display:none; }
 .picnic-app:has(.picnic-book-page) .picnic-paper { padding:6px; }
 .picnic-app:has(.picnic-book-page) .picnic-book-running-title { padding:2px 3px 8px; min-height:20px; font-size:9px; }
 .picnic-app:has(.picnic-book-page) .picnic-footer { display:none; }
 .picnic-book-page { display:grid; grid-template-columns:minmax(0,1fr) 170px; }
 .picnic-book-page>.picnic-world { min-height:0; height:calc(100svh - 90px); padding:12px 8px 34px; }
 .picnic-story-line { min-height:0; padding:18px 12px; border-top:0; border-left:1px solid #e8e6ce; display:flex; flex-direction:column; justify-content:center; }
 .picnic-line-en { font-size:17px; }
 .picnic-line-zh { font-size:11px; }
 .picnic-world-pack { flex-direction:row; align-items:center; gap:8px; }
 .picnic-book-page .picnic-delivery-scene { min-height:0; height:140px; width:43%; margin:0; gap:4px; }
 .picnic-book-page .picnic-live-friend { width:65px; height:110px; }
 .picnic-book-page .picnic-dropzone { width:80px; height:95px; padding:4px; }
 .picnic-book-page .picnic-dropzone>.picnic-piece { width:60px; height:72px; }
 .picnic-book-page .picnic-dropzone>span:last-child { font-size:8px; padding:4px; }
 .picnic-world-pack .picnic-food-tray { width:55%; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(2,56px); padding:5px; gap:3px; }
 .picnic-world-pack .picnic-food { width:100%; height:56px; padding:2px; }
 .picnic-world-pack .picnic-food>.picnic-piece { width:34px; height:34px; }
 .picnic-food small { font-size:8px; margin:2px 0 0; }
 .picnic-speech { font-size:8px; padding:5px 7px; top:-24px; }
 .picnic-bag-count { top:-17px; min-width:35px; height:23px; font-size:11px; }
 .picnic-pocket { bottom:8px; left:8px; max-width:calc(100% - 98px); gap:2px; }
 .picnic-pocket>span:first-child { font-size:8px; }
 .picnic-pocket>span:not(:first-child) { width:18px; height:20px; }
 .picnic-in-picture-tools { right:6px; bottom:4px; gap:2px; }
 .picnic-in-picture-tools>.picnic-button { width:44px; min-height:44px; height:44px; }
 .picnic-world-find .picnic-forest-search { width:100%; margin:auto auto 10px; gap:8px; }
 .picnic-world-find .picnic-bush { height:155px; }
 .picnic-world-find .picnic-hidden-friend { height:105px; bottom:12px; }
 .picnic-world-find .picnic-leaves { height:65px; }
 .picnic-world-find .picnic-bush-label { bottom:-14px; min-height:24px; font-size:9px; }
 .picnic-world-share { flex-direction:row; align-items:center; gap:8px; padding-top:28px!important; }
 .picnic-world-share .picnic-table-scene { width:64%; margin:0; }
 .picnic-world-share .picnic-guests { padding:0; gap:6px; }
 .picnic-world-share .picnic-guest { height:85px; min-height:85px; min-width:44px; }
 .picnic-world-share .picnic-guest .picnic-speech { top:-31px; min-width:80px; max-width:110px; padding:5px; font-size:8px; }
 .picnic-world-share .picnic-guest-invite,.picnic-world-share .picnic-contented { font-size:7px; top:-20px; padding:4px; }
 .picnic-world-share .picnic-gingham { min-height:60px; width:100%; margin-top:-4px; }
 .picnic-book-page .picnic-table-drop { min-height:56px; height:60px; width:85px; padding:2px; }
 .picnic-table-drop .picnic-plate { width:55px; height:30px; margin:1px 0; }
 .picnic-world-share .picnic-food-tray { width:32%; display:grid; grid-template-columns:1fr; gap:0; padding:4px; }
 .picnic-world-share .picnic-food { width:100%; height:49px; padding:1px; }
 .picnic-world-share .picnic-food>.picnic-piece { width:30px; height:30px; }
}
@media(prefers-reduced-motion:reduce){.picnic-app *{animation:none!important;transition:none!important;}}
.picnic-guest:disabled,.picnic-dropzone:disabled { opacity:1; }
/* The picnic uses the same room, book binding, and home navigation as the other books. */
.storybook-room:has(.picnic-in-book)>.storybook-book { display:flex; flex-direction:column; min-height:0; height:calc(100dvh - 112px); }
.storybook-room:has(.picnic-in-book)>.storybook-topbar { align-items:center; }
.picnic-in-book.picnic-app { flex:1; min-height:0; min-width:0; padding:0; overflow:auto; background:none; container-type:size; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
.picnic-in-book .picnic-paper { padding:0; border:0; margin:0; border-radius:0; box-shadow:none; background:none; max-width:none; }
.picnic-book-controls { display:flex; flex:0 0 auto; justify-content:flex-end; align-items:center; gap:6px; padding-bottom:6px; }
.picnic-book-controls button { min-width:44px; min-height:44px; border:1px solid #ccd7ba; border-radius:18px; padding:7px 10px; background:#eef2e3; color:#4c6643; font-family:inherit; font-size:11px; line-height:1.4; cursor:pointer; touch-action:manipulation; }
.picnic-book-controls button:focus-visible { outline:3px solid #f2d591; outline-offset:2px; }
.storybook-room:has(.picnic-in-book) .storybook-colophon { flex:0 0 auto; margin-top:12px; }
.picnic-in-book .picnic-book-running-title { padding-top:2px; }
.picnic-in-book .picnic-book-page>.picnic-world { min-height:0; height:clamp(310px,calc(100cqh - 180px),550px); }
:root[data-theme="night"] .picnic-in-book { color:#d5d9bd; }
:root[data-theme="night"] .picnic-in-book .picnic-paper { color:inherit; }
:root[data-theme="night"] .picnic-in-book .picnic-keepsakes,:root[data-theme="night"] .picnic-in-book .picnic-parent { border-color:#62664c; }
:root[data-theme="night"] .picnic-in-book .picnic-vocabulary summary,:root[data-theme="night"] .picnic-in-book .picnic-keepsakes>span { color:#c0c8a3; }
@media(max-width:760px){
 .storybook-room:has(.picnic-in-book)>.storybook-book { flex:1; height:auto; min-height:0; padding:12px 16px 16px 20px; }
 .storybook-room:has(.picnic-in-book) .storybook-colophon { margin-top:6px; padding-top:3px; font-size:8px; }
 .picnic-in-book.picnic-app:has(.picnic-book-page),.picnic-in-book.picnic-app { padding:0; }
 .picnic-in-book .picnic-paper { padding:0; }
 .picnic-in-book .picnic-book-page>.picnic-world { min-height:0; height:clamp(300px,calc(100cqh - 112px),550px); }
 .picnic-in-book .picnic-delivery-scene { min-height:0; height:clamp(115px,30cqh,185px); margin:12px 0 10px; }
 .picnic-in-book .picnic-live-friend { height:clamp(115px,30cqh,175px); }
 .picnic-in-book .picnic-world-pack .picnic-food-tray { grid-template-rows:repeat(2,60px); padding:5px; }
 .picnic-in-book .picnic-world-pack .picnic-food { height:60px; }
 .picnic-in-book .picnic-world-pack .picnic-food>.picnic-piece { width:40px; height:40px; }
}
@media(max-height:500px) and (orientation:landscape) and (pointer:coarse){
 .storybook-room:has(.picnic-in-book) { height:100dvh; min-height:0; padding:5px 8px 10px; display:flex; flex-direction:column; overflow:hidden; }
 .storybook-room:has(.picnic-in-book)>.storybook-topbar { display:grid; grid-template-columns:auto 1fr auto; margin-bottom:4px; gap:8px; }
 .storybook-room:has(.picnic-in-book) .storybook-room-name { grid-column:2; justify-self:center; }
 .picnic-book-controls { padding-bottom:2px; }
 .storybook-room:has(.picnic-in-book)>.storybook-book { flex:1; height:auto; min-height:0; padding:7px 6px 4px 10px; }
 .storybook-room:has(.picnic-in-book) .storybook-colophon { display:none; }
 .picnic-in-book .picnic-book-page>.picnic-world { min-height:0; height:calc(100cqh - 28px); }
 .picnic-in-book .picnic-delivery-scene { height:130px; margin:0; }
 .picnic-in-book .picnic-live-friend { height:110px; }
 .picnic-in-book .picnic-world-pack .picnic-food-tray { grid-template-rows:repeat(2,54px); }
 .picnic-in-book .picnic-world-pack .picnic-food { height:54px; }
 .picnic-in-book .picnic-world-pack .picnic-food>.picnic-piece { width:32px; height:32px; }
}
.storybook-book .picnic-in-book.picnic-app .picnic-paper { padding:0; background:none; border:0; box-shadow:none; }
.picnic-book-controls button { font-family:inherit; font-size:11px; line-height:1.4; }
@media(max-width:760px){.picnic-in-book .picnic-book-page>.picnic-world{height:clamp(290px,calc(100cqh - 130px),550px);}}
@media(max-height:500px) and (orientation:landscape) and (pointer:coarse){.picnic-in-book .picnic-book-page>.picnic-world{height:calc(100cqh - 28px);}}
.picnic-in-book.picnic-app { container-name:picnic-book; }
@media(max-width:760px) and (orientation:portrait){
 @container picnic-book (max-height:500px){
  .picnic-in-book .picnic-book-page>.picnic-world { height:calc(100cqh - 150px); min-height:0; padding:10px 8px 44px; }
  .picnic-story-line { min-height:0; padding:10px 12px; }
  .picnic-line-en { font-size:18px; line-height:1.5; margin-bottom:5px; }
  .picnic-line-zh { font-size:11px; line-height:1.5; }
  .picnic-delivery-scene { height:100px; min-height:0; margin:10px 0; }
  .picnic-live-friend { height:100px; width:95px; }
  .picnic-book-page .picnic-dropzone { height:110px; width:112px; }
  .picnic-book-page .picnic-dropzone>.picnic-piece { width:72px; height:80px; }
  .picnic-world-pack .picnic-food-tray { grid-template-rows:repeat(2,50px); padding:4px; }
  .picnic-world-pack .picnic-food { height:50px; padding:2px; }
  .picnic-world-pack .picnic-food>.picnic-piece { width:32px; height:32px; }
  .picnic-food small { font-size:8px; margin-top:2px; }
  .picnic-world-find .picnic-bush { height:180px; }
  .picnic-world-find .picnic-hidden-friend { height:125px; }
  .picnic-world-find .picnic-forest-search { margin:auto auto 30px; }
  .picnic-world-share .picnic-table-scene { margin:25px auto 8px; }
  .picnic-world-share .picnic-guest { height:100px; min-height:95px; }
  .picnic-world-share .picnic-gingham { min-height:65px; }
  .picnic-book-page .picnic-table-drop { height:65px; min-height:60px; }
  .picnic-world-share .picnic-food { height:58px; }
  .picnic-world-share .picnic-food>.picnic-piece { width:36px; height:36px; }
 }
}
.storybook-room:has(.picnic-in-book)>.storybook-book,.storybook-room:has(.picnic-in-book)>.storybook-topbar { width:100%; }
/* Let the cover illustration keep its native proportions instead of cropping it to a tall poster. */
.picnic-in-book .picnic-story-cover { display:block; min-height:0; padding:0; border-radius:12px; background:#edf0df; }
.picnic-in-book .picnic-story-cover>img { display:block; position:static; width:100%; height:auto; object-fit:contain; }
.picnic-in-book .picnic-story-cover::before,.picnic-in-book .picnic-cover-spine { display:none; }
.picnic-in-book .picnic-story-cover .picnic-unit-title { padding:20px 24px 24px; }
.picnic-in-book .picnic-story-cover .picnic-eyebrow { color:#7b8866; }
.picnic-in-book .picnic-story-cover .picnic-unit-title h1 { margin:8px 0 10px; font-size:clamp(25px,4vw,42px); color:#3f583d; }
.picnic-in-book .picnic-story-cover .picnic-unit-title p { margin:0; color:#657052; font-size:13px; line-height:1.85; }
.picnic-in-book .picnic-story-cover .picnic-unit-title>.picnic-button { margin-top:16px; }
:root[data-theme="night"] .picnic-book-controls button { background:#3e4938; color:#e2e6c1; border-color:#62664c; }
:root[data-theme="night"] .picnic-in-book .picnic-story-cover { background:#343e31; }
:root[data-theme="night"] .picnic-in-book .picnic-story-cover .picnic-unit-title :is(h1,p,.picnic-eyebrow) { color:#e2e6c1; }
@media(max-width:700px){
 .picnic-in-book .picnic-story-cover .picnic-unit-title { padding:16px; }
}
@media(min-width:761px){
 .picnic-in-book .picnic-story-cover { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); align-items:center; }
}
/* A quiet paper surface keeps the play pieces readable against the painted forest. */
.picnic-in-book .picnic-book-page { border-radius:10px; box-shadow:none; border-color:#dedbc4; }
.picnic-in-book .picnic-food-tray { background:#fff9e9; border:1px solid #d8cfac; border-bottom-width:3px; border-radius:14px; box-shadow:0 4px 10px #574c2410; }
.picnic-in-book .picnic-food { border-radius:10px; color:#596442; }
.picnic-in-book .picnic-food small { color:#596442; }
.picnic-in-book .picnic-food.is-packed { opacity:.72; filter:none; background:#eaf0da; border-color:#c6d3ad; }
.picnic-in-book .picnic-food.is-speaking { opacity:1; background:#fff0b8; }
.picnic-in-book .picnic-world-share .picnic-food:disabled { opacity:1; }
.picnic-in-book .picnic-world-share .picnic-food.is-packed { background:transparent; border-color:transparent; filter:none; box-shadow:none; }
.picnic-in-book .picnic-world-share .picnic-food.is-packed small { color:#567042; }
.picnic-in-book .picnic-world-share .picnic-contented { background:#fff9e9; color:#596442; }
.picnic-in-book .picnic-world-share .picnic-gingham { border-color:#d8c4a2; box-shadow:0 4px 8px #6c653010; }
.picnic-in-book .picnic-story-line { background:#fcf6e6; }
.picnic-in-book .picnic-world-pack::before { background:linear-gradient(transparent,#f4edce99); }
:root[data-theme="night"] .picnic-in-book .picnic-food-tray { background:#384033; border-color:#6e7054; }
:root[data-theme="night"] .picnic-in-book .picnic-food small { color:#e0e4c5; }
:root[data-theme="night"] .picnic-in-book .picnic-food.is-packed { background:#4b583c; border-color:#798b5c; }
:root[data-theme="night"] .picnic-in-book .picnic-world-share .picnic-food.is-packed { background:transparent; border-color:transparent; }
:root[data-theme="night"] .picnic-in-book .picnic-world-share .picnic-food.is-packed small { color:#d3dfb5; }
:root[data-theme="night"] .picnic-in-book .picnic-story-line { background:#282f2e; }
@media(max-width:760px) and (orientation:portrait){
 .picnic-in-book .picnic-book-page>.picnic-world-pack { display:flex; flex-direction:column; justify-content:flex-start; padding:38px 12px 54px; height:clamp(290px,calc(100cqh - 140px),470px); }
 .picnic-in-book .picnic-world-pack .picnic-delivery-scene { flex:1; width:100%; min-height:0; margin:0 0 14px; gap:24px; align-items:flex-end; }
 .picnic-in-book .picnic-world-pack .picnic-live-friend { flex:0 1 125px; width:125px; height:clamp(100px,26cqh,175px); }
 .picnic-in-book .picnic-world-pack .picnic-dropzone { flex:0 0 110px; width:110px; height:120px; padding:6px; border-width:1px; border-radius:14px; }
 .picnic-in-book .picnic-world-pack .picnic-dropzone>.picnic-piece { width:76px; height:88px; }
 .picnic-in-book .picnic-world-pack .picnic-food-tray { flex:0 0 auto; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(2,64px); width:100%; gap:4px; padding:6px; }
 .picnic-in-book .picnic-world-pack .picnic-food { width:100%; height:64px; padding:3px; }
 .picnic-in-book .picnic-world-pack .picnic-food>.picnic-piece { width:40px; height:40px; }
 .picnic-in-book .picnic-world-pack .picnic-food small { font-size:11px; margin-top:2px; }
 .picnic-in-book .picnic-world-pack .picnic-pocket { opacity:1; bottom:10px; }
 @container picnic-book (max-height:500px){
  .picnic-in-book .picnic-book-page>.picnic-world-pack { height:calc(100cqh - 140px); padding:30px 8px 48px; }
  .picnic-in-book .picnic-world-pack .picnic-live-friend { height:100px; }
  .picnic-in-book .picnic-world-pack .picnic-dropzone { flex-basis:92px; width:92px; height:100px; }
  .picnic-in-book .picnic-world-pack .picnic-dropzone>.picnic-piece { width:62px; height:68px; }
  .picnic-in-book .picnic-world-pack .picnic-delivery-scene { margin-bottom:8px; }
  .picnic-in-book .picnic-world-pack .picnic-food-tray { grid-template-rows:repeat(2,46px); gap:2px; padding:4px; }
  .picnic-in-book .picnic-world-pack .picnic-food { height:46px; padding:1px; }
  .picnic-in-book .picnic-world-pack .picnic-food>.picnic-piece { width:28px; height:28px; }
  .picnic-in-book .picnic-world-pack .picnic-food small { font-size:10px; margin-top:1px; }
 }
}