.picnic-home .picnic-hero{padding-top:12px;background:#e8f5f3}
.picnic-backdrop{position:relative;width:min(calc(100% - 40px),2200px,calc(335svh - 1173px));aspect-ratio:3.35;margin:0 auto 12px;isolation:isolate;overflow:hidden}
.backdrop-art{position:absolute;left:0;right:0;top:50%;aspect-ratio:3/1;transform:translateY(-50%);pointer-events:none}
.backdrop-art img,.backdrop-art canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.backdrop-art img{filter:saturate(.8)}.scene-ready .backdrop-art img{filter:grayscale(.86) saturate(.7)}
.motion-paused .backdrop-art img{filter:saturate(.8)}.motion-paused .backdrop-art canvas{display:none}
@media(prefers-reduced-motion:reduce),(pointer:coarse){.scene-ready .backdrop-art img{filter:saturate(.8)}.backdrop-art canvas{display:none}}
.picnic-home .collection-heading>div{min-width:0;max-width:100%}
.picnic-home .collection-heading h1{font:700 36px/1.15 Bricolage,sans-serif;max-width:820px;margin:0;white-space:normal;overflow-wrap:break-word}
.play-strip{background:#f8fcf9;border-top:1px solid #d3e5dd;border-bottom:1px solid #d3e5dd}
.play-samples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:36px;max-width:940px;padding-top:14px;padding-bottom:14px}
.play-sample{display:grid;grid-template-columns:76px minmax(0,1fr);align-items:center;gap:18px;min-width:0;--sample-angle:0deg;transform:translate(var(--sample-x,0px),var(--sample-y,0px));transition:transform .5s cubic-bezier(.2,.75,.2,1);color:#365a50}
.sample-color{--paper-angle:-5deg}.sample-difference{--paper-angle:5deg}
.sample-paper{position:relative;display:block;width:100%;aspect-ratio:778/1100;transform:rotate(var(--paper-angle,0deg));background:white;box-shadow:0 5px 14px #25473b24,0 1px 2px #25473b30}
.sample-paper img{display:block;width:100%;height:100%;object-fit:contain}
.sample-color .sample-paper{box-shadow:-3px 3px 0 #f4cf65,0 5px 14px #25473b24}.sample-maze .sample-paper{box-shadow:3px 3px 0 #97cbdc,0 5px 14px #25473b24}.sample-difference .sample-paper{box-shadow:3px 3px 0 #edb4c8,0 5px 14px #25473b24}
.sample-color .sample-caption{color:#83621c}.sample-maze .sample-caption{color:#246a80}.sample-difference .sample-caption{color:#934263}
.sample-paper canvas,.demo-annotation{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#coloring-brush{mix-blend-mode:multiply}.demo-annotation{color:#e56447;overflow:visible}
.sample-caption{display:flex;align-items:center;justify-content:flex-start;gap:8px;margin:0;min-height:44px;font-size:16px}
.sample-caption strong{font:700 18px/1.25 Bricolage,sans-serif;text-align:left;white-space:normal;overflow-wrap:anywhere}.sample-caption svg{width:17px;height:17px;flex:none}.sample-caption>svg:first-child{display:none}.sample-caption>svg:last-child{width:15px;height:15px}
.play-sample:hover .sample-caption,.play-sample:focus-visible .sample-caption{color:#ad392b}
#maze-trace{stroke-dasharray:1;stroke-dashoffset:1;opacity:.9}
.sample-maze:hover #maze-trace,.sample-maze:focus-visible #maze-trace{animation:maze-walk 2.4s ease-in-out forwards}
#difference-marks circle{opacity:0;transform-box:fill-box;transform-origin:center;transition:opacity .25s,scale .35s;scale:.6;transition-delay:var(--mark-delay)}
.sample-difference:hover circle,.sample-difference:focus-visible circle{opacity:1;scale:1}
.play-reassurance{display:flex;justify-content:space-between;align-items:center;gap:20px;max-width:940px;padding-top:13px;padding-bottom:13px}
.play-reassurance p{font-size:13px;color:#49665b;margin:0}.play-reassurance p span{padding:0 9px;color:#829c8e}
.play-reassurance a{font-size:14px;display:flex;align-items:center;gap:12px}.play-reassurance a svg{width:16px;height:16px}
.activity-navigation{display:flex;gap:7px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:18px}
.activity-navigation button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 12px;font-size:14px;border-bottom:2px solid transparent;transition:background .2s,color .2s}
.activity-navigation button[aria-pressed=true]{border-color:#c94434;color:#ac382b;background:#fff4ee}.activity-navigation button:hover{background:#f1f6f1}.activity-navigation svg{width:18px;height:18px;flex:none}
.library-format{display:flex;align-items:center;gap:0;margin:0 0 20px}
.library-format button{display:flex;align-items:center;gap:8px;min-height:43px;border:1px solid #a8bdb0;padding:9px 14px;font-size:14px;background:white;margin-right:-1px}
.library-format button:first-child{border-radius:4px 0 0 4px}.library-format button:last-child{border-radius:0 4px 4px 0}
.library-format button[aria-pressed=true]{background:#eaf3e9;border-color:#597660;z-index:1;box-shadow:inset 0 0 0 1px #597660}.library-format svg{width:17px;height:17px}
.library-refinements{display:flex;align-items:center;flex-wrap:wrap;gap:15px;border-bottom:1px solid var(--line);padding-bottom:15px}
.picnic-home .library-refinements .age-filter{border:0;padding:0;flex:none}.library-refinements>a{font-size:13px;text-decoration:underline;margin-left:auto}
.difficulty-label{display:flex;align-items:center;gap:8px;margin-left:10px;font-size:13px}.difficulty-label select{font:14px DMSans,sans-serif;color:#335544;border:1px solid #b9cabf;border-radius:4px;background:white;min-height:43px;padding:8px 24px 8px 10px}
.activity-theme{font-size:12px;line-height:1.5;color:#5c7465;margin:17px 0 3px}.activity-theme+.theme-title{margin-top:0}
.single-art .theme-sheet-front{width:56%;left:22%;top:16%;transform:rotate(-4deg)}
.single-art .theme-sheet-back{width:49%;left:40%;top:24%;opacity:.95}
.single-art:hover .theme-sheet-front,.single-art:focus-visible .theme-sheet-front{transform:translate(-2px,-8px) rotate(-7deg)}
.edition-options{column-gap:0;row-gap:9px}.edition-options>span{font-size:12px}
.activity-source{padding:19px 0;border-top:1px solid var(--line);margin-top:20px;font-size:14px}.activity-source p{margin:0 0 10px;color:var(--muted)}.activity-source a{display:inline-flex;gap:8px;align-items:center;color:#af3b2d;margin-right:20px;text-decoration:underline}.activity-source svg{width:14px;height:14px}
.detail-page[data-single] .page-stage{height:560px}.detail-page[data-single] .contents-list{grid-template-columns:1fr}
.detail-page .print-note{font-size:14px;line-height:1.6;color:var(--muted);margin:17px 0}
.picnic-home.motion-paused .play-sample{transform:rotate(var(--sample-angle))}.motion-paused #maze-trace{stroke-dashoffset:0}.motion-paused #difference-marks circle{opacity:1;scale:1}
@keyframes maze-walk{to{stroke-dashoffset:0}}
@media(max-width:1080px){.activity-navigation{gap:3px}.activity-navigation button{padding:10px;font-size:13px}.difficulty-label{margin-left:0}}
@media(max-width:760px){.play-samples{gap:25px;max-width:640px}.play-sample{grid-template-columns:1fr;justify-items:center;gap:8px}.sample-paper{width:62px}.sample-caption{gap:5px;min-height:38px;justify-content:center}.sample-caption strong{font-size:15px;text-align:center}.sample-caption>svg:last-child{width:13px;height:13px}.picnic-home .picnic-heading h1{font-size:52px}.picnic-home .picnic-heading>p:not(.eyebrow){font-size:16px}.activity-navigation{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.activity-navigation button{font-size:13px;padding:9px 5px;flex-direction:column;gap:5px;min-height:67px;text-align:center}.library-refinements{gap:12px}.library-refinements>a{margin-left:0}.picnic-home .collection-heading h2{font-size:30px}.detail-page[data-single] .page-stage{height:420px}}
@media(max-width:500px){.picnic-home .picnic-hero{padding-top:12px}.picnic-home .picnic-heading h1{font-size:49px}.picnic-home .picnic-heading .eyebrow{font-size:10px;margin-bottom:6px}.picnic-home .picnic-heading>p:not(.eyebrow){max-width:310px;margin:8px auto 0}.play-samples{gap:14px;padding:12px 20px}.sample-paper{width:58px}.sample-caption strong{font-size:14px}.sample-caption>svg:last-child{display:none}.play-reassurance{justify-content:center;flex-wrap:wrap;gap:7px;padding-top:10px;padding-bottom:12px}.play-reassurance p{font-size:12px}.play-reassurance a{font-size:14px}.activity-navigation{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.activity-navigation button{font-size:13px;min-height:63px;gap:5px}.activity-navigation button:first-child{grid-column:1/-1;flex-direction:row;min-height:42px}.library-format{width:100%}.library-format button{flex:1;justify-content:center;font-size:13px;padding:9px 11px}.difficulty-label{font-size:13px}.difficulty-label select{font-size:13px;min-height:40px}.picnic-home .library-search{margin-bottom:15px}.picnic-home .collection-heading h2{font-size:29px}.activity-theme{font-size:13px}.detail-page[data-single] .page-stage{height:370px}}
@media(max-width:350px){.picnic-home .picnic-heading h1{font-size:43px}.play-samples{gap:10px;padding-left:16px;padding-right:16px}.picnic-home .picnic-heading>p:not(.eyebrow){font-size:15px}.activity-navigation button{font-size:12px}.play-reassurance p{font-size:11px}.detail-page[data-single] .page-stage{height:310px}}
@media(min-width:761px) and (max-height:880px){.picnic-home .announcement{height:22px}.picnic-home .site-header{height:58px;min-height:58px}.picnic-home .site-header .brand{font-size:25px}.picnic-home .picnic-hero{padding-top:8px}.picnic-backdrop{width:min(calc(100% - 32px),2200px,calc(335svh - 804px));margin-bottom:8px}.play-samples{padding-top:6px;padding-bottom:6px}.play-sample{grid-template-columns:48px minmax(0,1fr);gap:18px}.sample-caption strong{font-size:17px}.play-reassurance{padding-top:6px;padding-bottom:6px}.play-reassurance p,.play-reassurance a{font-size:12px}.picnic-home .collection{padding-top:12px}.picnic-home .collection-heading .eyebrow{margin-top:0}}
@media(max-width:760px){.picnic-backdrop{width:calc(100% - 20px);max-width:480px;aspect-ratio:3/2;margin:0 auto;overflow:visible}.backdrop-art{inset:0;aspect-ratio:auto;transform:none}.picnic-home .collection-heading h1{font-size:30px}}
@media(max-width:500px){.picnic-home .collection-heading h1{font-size:29px}}
@media(prefers-reduced-motion:reduce),(pointer:coarse){#maze-trace{stroke-dashoffset:0}#difference-marks circle{opacity:1;scale:1}.play-sample{transform:rotate(var(--sample-angle))}}
