:root{--post-paper:#fff5d9;--post-ink:#34443d;--post-red:#d95862;--post-blue:#5d91ad;--post-wood:#a66d3e}
.post-scene{--customer-visual-h:clamp(150px,30vmin,280px);display:block!important;min-height:calc(100vh - 76px);padding:0!important;background:#d7c29a!important;overflow:hidden!important}
.post-progress{position:absolute;z-index:10;top:3%;left:3%;display:grid;grid-template-columns:auto auto;align-items:center;gap:2px 9px;padding:8px 14px;border:3px solid rgba(255,246,218,.88);border-radius:999px;background:rgba(72,87,72,.86);box-shadow:0 6px 16px rgba(38,42,29,.2);color:#fffaf0;font-size:13px;font-weight:1000;backdrop-filter:blur(5px)}
.post-progress small{grid-column:1/2;font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:#ffe7a3}.post-progress>div{grid-row:1/3;grid-column:2;display:flex;gap:5px}.post-progress i{width:9px;height:9px;border:2px solid rgba(255,255,255,.75);border-radius:50%;background:transparent}.post-progress i.done{background:#f7ce63}.post-progress i.current{background:white;box-shadow:0 0 0 3px rgba(247,206,99,.55)}
.post-request{position:absolute;z-index:9;top:4%;left:38%;width:min(31%,390px);display:grid;grid-template-columns:1fr 1fr;gap:3px 15px;padding:16px 22px 18px;background:linear-gradient(145deg,#fffbed,#f7e6bb);color:#615037;filter:drop-shadow(0 8px 8px rgba(58,45,28,.25));transform:rotate(-1deg);clip-path:polygon(4% 0,96% 1%,100% 90%,96% 100%,5% 97%,0 10%)}
.post-request:before{content:"";position:absolute;top:-9px;left:48%;width:15px;height:15px;border-radius:50%;background:#bd4e4d;box-shadow:inset 0 2px 2px rgba(255,255,255,.45),0 3px 4px rgba(44,34,24,.28)}
.post-request>small{grid-column:1/3;font-size:8px;font-weight:1000;letter-spacing:.18em;color:#94754c}.post-request>strong{grid-column:1/3;font-family:Georgia,serif;font-size:clamp(21px,2.5vw,35px);line-height:1;color:#ba4f58}.post-request>span{font-size:11px}.post-request b{font-size:13px;color:#3d6d79}.post-request>em{grid-column:1/3;margin-top:5px;padding:4px 8px;border-radius:8px;background:#e1f0cd;color:#41613c;font-size:11px;font-style:normal;font-weight:1000}
.post-customer{position:absolute!important;z-index:5!important;left:4%;bottom:3%;width:28%;height:74%;display:block;overflow:visible;pointer-events:none}.post-customer img{--character-base-x:-50%;--character-base-y:var(--sprite-foot-gap,11%);position:absolute;left:50%;bottom:0;width:auto!important;height:var(--customer-canvas-h,clamp(193px,38.5vmin,359px))!important;max-width:none!important;max-height:none!important;object-fit:contain;object-position:center bottom;translate:calc(var(--character-base-x) + var(--character-drag-x,0px)) calc(var(--character-base-y) + var(--character-drag-y,0px))}
.post-customer img[data-sprite="sunny"]{--customer-canvas-h:clamp(193px,38.5vmin,359px);--sprite-foot-gap:11%}.post-customer img[data-sprite="maple"]{--customer-canvas-h:clamp(172px,34.4vmin,321px);--sprite-foot-gap:6.7%}.post-customer img[data-sprite="flint"]{--customer-canvas-h:clamp(213px,42.6vmin,398px);--sprite-foot-gap:12.4%}.post-customer img[data-sprite="dune"]{--customer-canvas-h:clamp(217px,43.4vmin,405px);--sprite-foot-gap:14.2%}.post-customer img[data-sprite="cloud"]{--customer-canvas-h:clamp(208px,41.5vmin,388px);--sprite-foot-gap:11.2%}
.post-workbench{position:absolute;z-index:7;right:2.5%;bottom:5%;width:65%;height:62%}
.post-workbench:before{content:"";position:absolute;z-index:0;inset:22% 0 0;border:5px solid rgba(92,56,33,.76);border-radius:36px 36px 17px 17px;background:linear-gradient(98deg,rgba(255,255,255,.12),transparent 20% 70%,rgba(74,42,24,.12)),repeating-linear-gradient(2deg,#bd8652 0 18px,#b67d49 19px 24px);box-shadow:inset 0 7px 0 rgba(255,223,169,.32),0 16px 0 rgba(91,57,35,.68),0 25px 28px rgba(46,35,24,.24)}
.parcel-shelf{position:absolute;z-index:5;left:3%;top:27%;width:27%;height:46%;display:grid;place-items:center}.parcel-shelf:before{content:none}
.parcel-prop{--stamp-x:clamp(125px,15vw,255px);position:relative;width:clamp(105px,11vw,150px);aspect-ratio:1.24;border:4px solid #81512e;border-radius:7px;background:linear-gradient(90deg,transparent 44%,#e0ad68 44% 57%,transparent 57%),linear-gradient(150deg,#d69a5d,#b6763f);box-shadow:inset 0 3px 0 rgba(255,226,178,.38),0 8px 0 #744725,0 13px 18px rgba(63,40,24,.28);color:#594029;cursor:pointer;touch-action:manipulation;transition:transform .48s cubic-bezier(.25,.9,.25,1.16),filter .2s,opacity .25s}
.parcel-prop>span{display:block;font-size:clamp(43px,5vw,70px);line-height:.9;filter:saturate(.65) sepia(.18)}.parcel-prop>small{position:absolute;right:8%;bottom:7%;left:8%;padding:4px 2px;border:2px solid #776246;background:#fff5d5;font-size:clamp(6px,.67vw,9px);font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.parcel-prop:hover,.parcel-prop:focus-visible{filter:brightness(1.08) drop-shadow(0 0 8px rgba(255,234,145,.75))}.parcel-prop.to-stamp{transform:translateX(var(--stamp-x)) rotate(1deg)}.parcel-prop.stamped{filter:saturate(.82) drop-shadow(0 0 8px rgba(255,239,168,.7))}
.parcel-service-mark{position:absolute;z-index:5;top:43%;right:9%;left:9%;min-height:18px;overflow:hidden;color:#244f77;font:1000 clamp(9px,1vw,14px)/1.1 "Comic Sans MS","Trebuchet MS",cursive;letter-spacing:.06em;text-align:center;text-shadow:0 1px rgba(255,255,255,.35);transform:rotate(-3deg)}.parcel-service-mark.try-again{color:#9e3d37;text-decoration:line-through}.parcel-service-mark.writing{animation:writeService .34s steps(8,end) both}.parcel-service-mark:empty{display:none}
.service-marker{position:fixed;z-index:40;width:58px;height:15px;border:3px solid #49362b;border-radius:9px 3px 3px 9px;background:linear-gradient(180deg,#fff1bb 0 38%,var(--marker-ink,#4c7996) 39% 100%);box-shadow:0 5px 6px rgba(37,27,20,.3);opacity:0;pointer-events:none}.service-marker:after{content:"";position:absolute;right:-13px;top:2px;border:5px solid transparent;border-left:10px solid var(--marker-ink,#4c7996)}.service-marker.visible{opacity:1}.service-marker.economy{--marker-ink:#6a965d}.service-marker.standard{--marker-ink:#4c7996}.service-marker.express{--marker-ink:#bd5158}
.stamp-pad{position:absolute;z-index:4;left:36%;top:36%;width:18%;height:37%;display:grid;place-items:center;border:5px solid #5f5045;border-radius:50%;background:radial-gradient(circle,#735b51 0 46%,#392e2c 47% 58%,#c7a46c 59%);box-shadow:inset 0 5px 9px rgba(0,0,0,.28),0 7px 0 rgba(77,48,30,.45)}
.post-stamp{position:absolute;z-index:8;top:-39%;width:clamp(66px,7vw,94px);aspect-ratio:.9;border:4px solid #6d3f2f;border-radius:17px 17px 8px 8px;background:linear-gradient(#df7d65,#b94f49);box-shadow:inset 0 4px 0 rgba(255,255,255,.23),0 8px 0 #703a31;color:#fff9df;font-size:10px;font-weight:1000;letter-spacing:.08em;cursor:pointer;transition:transform .15s,filter .15s,opacity .15s}.post-stamp:before{content:"";position:absolute;left:18%;right:18%;bottom:-17px;height:18px;border-radius:3px;background:#51413a}.post-stamp[aria-disabled="false"]:hover{transform:translateY(-4px)}.post-stamp[aria-disabled="true"]{opacity:.58}.post-stamp[aria-disabled="true"]:hover,.post-stamp[aria-disabled="true"]:focus-visible{filter:drop-shadow(0 0 8px rgba(255,226,133,.65))}.post-stamp:active,.post-scene[data-phase="stamping"] .post-stamp{transform:translateY(22px)}.stamp-mark{position:absolute;z-index:9;right:7%;top:14%;padding:3px 5px;border:3px double #b04b4e;border-radius:50%;color:#a93f43;font-size:7px;font-style:normal;font-weight:1000;opacity:0;transform:rotate(-13deg) scale(1.7);transition:opacity .2s,transform .22s}.stamp-mark.visible{opacity:1;transform:rotate(-13deg) scale(1)}
.delivery-yard{position:absolute;z-index:6;top:18%;right:0;width:45%;height:78%;display:grid;grid-template-rows:repeat(3,1fr);gap:2%}
.delivery-lane{position:relative;min-height:58px;border:0;background:transparent;color:#493f35;cursor:pointer;text-align:right;padding:9px 8px 9px 48%;touch-action:manipulation;transition:transform .16s,filter .16s}.delivery-lane .track{position:absolute;z-index:-1;left:1%;right:2%;top:50%;height:31%;border:3px solid rgba(91,67,45,.52);border-radius:45% 16px 16px 48%;background:repeating-linear-gradient(91deg,rgba(255,255,255,.17) 0 15px,rgba(64,49,35,.08) 16px 24px),#d4b175;box-shadow:0 5px 0 rgba(80,54,34,.34);transform:translateY(-50%) rotate(var(--lane-angle,0deg))}.delivery-lane.economy{--lane-angle:-2deg;--marker-ink:#6a965d}.delivery-lane.standard{--lane-angle:1deg;--marker-ink:#4c7996}.delivery-lane.express{--lane-angle:-1deg;--marker-ink:#bd5158}.delivery-lane .track:after{content:"";position:absolute;left:7%;right:7%;top:43%;border-top:3px dashed rgba(255,248,203,.74)}.delivery-lane .vehicle{position:absolute;left:8%;top:50%;font-size:clamp(25px,3.6vw,52px);filter:drop-shadow(0 4px 2px rgba(51,39,26,.28));transform:translateY(-57%);transition:left .5s cubic-bezier(.2,.8,.25,1.05),transform .2s}.route-pen{position:absolute;z-index:3;left:39%;top:50%;width:clamp(35px,3.2vw,50px);height:12px;border:2px solid #4c392c;border-radius:7px 2px 2px 7px;background:linear-gradient(#fff0b9 0 42%,var(--marker-ink) 43%);box-shadow:0 3px 3px rgba(50,35,25,.25);transform:translateY(-50%) rotate(-7deg)}.route-pen:after{content:"";position:absolute;right:-9px;top:1px;border:4px solid transparent;border-left:7px solid var(--marker-ink)}.delivery-lane strong,.delivery-lane small{position:relative;z-index:2;display:block;text-shadow:0 1px rgba(255,247,220,.85)}.delivery-lane strong{font-size:clamp(12px,1.25vw,17px)}.delivery-lane small{font-size:clamp(8px,.82vw,11px);font-weight:900}.delivery-lane:hover,.delivery-lane:focus-visible{transform:translateX(4px);filter:brightness(1.08) saturate(1.13)}.delivery-lane.selected .track{outline:4px solid rgba(255,224,99,.88);box-shadow:0 5px 0 rgba(80,54,34,.34),0 0 19px #ffe17a}.delivery-lane.wrong .track{outline:4px solid rgba(211,72,80,.75)}.delivery-lane.unavailable{filter:grayscale(.7);opacity:.68}.delivery-lane.unavailable .track:before{content:"CLOSED";position:absolute;z-index:3;left:25%;top:-7px;padding:2px 6px;border-radius:3px;background:#b84a50;color:white;font-size:7px;font-weight:1000;transform:rotate(-7deg)}.delivery-lane:disabled{cursor:default}.delivery-lane.delivering .vehicle{left:76%;animation:postVehicleBob .36s ease-in-out infinite alternate}.delivery-lane.arrived .vehicle{left:78%;filter:drop-shadow(0 0 9px #ffec8b)}
.post-feedback{position:absolute;z-index:12;right:4%;bottom:1%;width:59%;min-height:38px!important;margin:0!important;padding:9px 18px!important;border:3px solid rgba(255,246,219,.91);border-radius:999px!important;background:rgba(54,72,64,.9)!important;box-shadow:0 6px 16px rgba(36,42,31,.2);color:#fffbed!important;font-size:clamp(10px,1vw,13px);backdrop-filter:blur(5px)}.post-feedback.good{background:rgba(48,111,75,.92)!important}.post-feedback:empty{opacity:0}
.parcel-prop.delivery-economy,.parcel-prop.delivery-standard,.parcel-prop.delivery-express{pointer-events:none;animation:postParcelTravel 1.15s cubic-bezier(.25,.7,.3,1) forwards}
@keyframes postParcelTravel{0%{transform:translateX(var(--stamp-x)) rotate(1deg);opacity:1}75%{opacity:1}100%{transform:translateX(clamp(340px,47vw,760px)) translateY(-20px) rotate(8deg) scale(.48);opacity:0}}
@keyframes postVehicleBob{to{transform:translateY(-65%) rotate(3deg)}}
@keyframes writeService{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
button:focus-visible,.post-progress>span:focus-visible{outline:4px solid #fff;outline-offset:3px;box-shadow:0 0 0 7px #325e79}
.delivery-lane em{position:relative;z-index:2;display:block;margin-top:2px;color:#80513b;font-size:clamp(7px,.7vw,9px);font-style:normal;font-weight:1000;line-height:1.05;text-shadow:0 1px rgba(255,247,220,.85)}.delivery-lane em[hidden]{display:none}

@media(max-width:850px){
  .post-scene{min-height:960px!important;overflow:hidden!important}.scene-art{background-size:auto 560px!important}.post-request{top:84px;right:3%;left:auto;width:48%}.post-request>span,.post-request>em{font-size:13px}.post-customer{top:54px!important;bottom:auto!important;left:2%!important;width:43%!important;height:330px!important}.post-workbench{right:3%;bottom:5%;width:94%;height:60%}.post-workbench:before{inset:16% 0 0}.parcel-shelf{left:4%;top:19%;width:31%;height:31%}.parcel-prop{--stamp-x:clamp(135px,37vw,260px);width:125px}.stamp-pad{left:42%;top:24%;width:20%;height:23%}.delivery-yard{top:51%;right:3%;width:94%;height:42%;grid-template-rows:repeat(3,1fr)}.delivery-lane{padding-left:62%;padding-right:6%}.delivery-lane .vehicle{left:13%}.delivery-lane strong{font-size:14px}.delivery-lane small{font-size:12px}.delivery-lane em{font-size:11px;line-height:1.2}.post-feedback{right:5%;bottom:1%;width:90%}}
@media(max-width:560px){
  .post-scene{min-height:1030px!important}.scene-art{background-size:auto 490px!important}.post-request{top:67px;right:8px;width:56%;padding:13px 15px}.post-request>strong{font-size:20px}.post-request>span{grid-column:1/3}.post-customer{top:48px!important;left:-2%!important;width:49%!important;height:300px!important}.post-workbench{bottom:4%;height:68%}.post-workbench:before{inset:10% 0 0;border-radius:24px 24px 12px 12px}.parcel-shelf{left:3%;top:11%;width:37%;height:29%}.parcel-prop{--stamp-x:clamp(115px,39vw,190px);width:105px}.stamp-pad{left:47%;top:16%;width:26%;height:22%}.post-stamp{top:-48%;width:65px}.delivery-yard{top:44%;right:2%;width:96%;height:43%}.delivery-lane{min-height:68px;padding-left:54%;padding-right:4%}.delivery-lane .vehicle{left:10%;font-size:34px}.delivery-lane strong{font-size:13px}.delivery-lane small{font-size:11px}.post-feedback{right:3%;bottom:0;width:94%;padding:8px 12px!important;border-radius:16px!important}}
@media(prefers-reduced-motion:reduce){
  .parcel-prop,.post-stamp,.stamp-mark,.service-marker,.parcel-service-mark,.delivery-lane,.delivery-lane .vehicle{transition:none!important;animation:none!important}.delivery-lane.delivering .vehicle{left:76%;animation:none}.parcel-prop.delivery-economy,.parcel-prop.delivery-standard,.parcel-prop.delivery-express{opacity:0!important;animation:none!important}
}
[data-motion="reduced"] .parcel-prop,[data-motion="reduced"] .post-stamp,[data-motion="reduced"] .stamp-mark,[data-motion="reduced"] .service-marker,[data-motion="reduced"] .parcel-service-mark,[data-motion="reduced"] .delivery-lane,[data-motion="reduced"] .delivery-lane .vehicle{transition:none!important;animation:none!important}[data-motion="reduced"] .delivery-lane.delivering .vehicle{left:76%;animation:none}[data-motion="reduced"] .parcel-prop.delivery-economy,[data-motion="reduced"] .parcel-prop.delivery-standard,[data-motion="reduced"] .parcel-prop.delivery-express{opacity:0!important;animation:none!important}
.route-reasons{display:grid;gap:6px;grid-column:1/-1;margin-top:7px;max-width:320px}.route-reasons>strong{font-size:clamp(12px,1.25vw,15px);color:#52361e}.route-reasons button{min-height:44px;border:2px solid rgba(91,58,28,.28);border-radius:999px;background:#fff9df;color:#4b321e;padding:6px 12px;font:800 clamp(11px,1.05vw,13px)/1.15 inherit;text-align:left;box-shadow:0 3px 0 rgba(78,48,22,.16);cursor:pointer}.route-reasons button:focus-visible,.route-reasons button:hover{outline:3px solid #f2c14e;outline-offset:2px;background:#fff3b6}.post-scene[data-phase="reason"] .delivery-lane{pointer-events:none;opacity:.72}

/* Child-test pass: keep the next action on the request card and ground the pens. */
.post-action{grid-column:1/-1;margin:9px -4px -3px;padding-top:8px;border-top:2px dashed #c9a773;color:#4b321e;font-size:clamp(16px,1.45vw,20px);font-weight:1000;line-height:1.18;text-align:center}.post-feedback{font-size:clamp(15px,1.25vw,18px);font-weight:1000}.route-pen{top:57%;height:14px;box-shadow:0 5px 0 rgba(76,46,28,.22),0 7px 6px rgba(50,32,22,.32);transform:translateY(-50%) rotate(-2deg)}.route-pen:before{content:"";position:absolute;left:4px;right:-7px;bottom:-8px;height:5px;border-radius:50%;background:rgba(65,42,28,.24);filter:blur(2px)}
@media(max-width:850px){.post-action{font-size:17px}.post-request{padding-bottom:13px}.post-feedback{font-size:16px}.route-pen{height:15px}}

/* The route name, price and travel time must be readable before a child picks
   up a pen. Keep the pens grounded while enlarging only their writing. */
.delivery-lane strong { font-size: clamp(16px,1.55vw,22px); line-height: 1.05; }
.delivery-lane small { margin-top: 3px; font-size: clamp(13px,1.15vw,16px); line-height: 1.15; }

@media(max-width:850px){
  .delivery-lane strong { font-size: 18px; }
  .delivery-lane small { font-size: 15px; }
}

@media(max-width:560px){
  .delivery-lane strong { font-size: 17px; }
  .delivery-lane small { font-size: 14px; }
}
@media(max-width:560px){.post-action{font-size:16px;margin-top:7px}.post-request{width:60%}.post-feedback{font-size:16px;line-height:1.2}}

/* Box-free room play. These large transparent targets follow recognisable
   painted objects; the request, customer and workbench remain on higher
   layers and therefore always win overlapping taps. */
.post-shelves-wonder{left:0;top:0;width:35%;height:37%;border-radius:0 0 34% 0}
.post-lamp-wonder{left:32.5%;top:14%;width:8%;height:21%;border-radius:50% 50% 32% 32%}
.post-letters-wonder{left:35%;top:0;width:64%;height:14%;border-radius:0 0 42% 42%}
.post-vine-wonder{left:76%;top:0;width:23%;height:19%;border-radius:0 0 45% 45%}

.post-shelves-wonder::after{content:"✉";left:47%;top:50%;color:#fff5d8;font-size:clamp(18px,2.3vw,34px);text-shadow:-43px 12px #f4d4aa,37px -10px #fff4d5,58px 22px #e8c58e;filter:drop-shadow(0 4px 3px rgba(75,48,28,.28))}
.post-shelves-wonder::before{content:"✦";left:48%;top:47%;color:#ffe790;font-size:14px;text-shadow:-48px 16px #ffe790,40px -12px #fff5b5,66px 19px #ffe790}
.post-shelves-wonder.is-active::after{animation:postShelfHop 1.15s cubic-bezier(.2,.75,.24,1)}
.post-shelves-wonder.is-active::before{animation:postShelfGlow 1.2s ease-out}

.post-lamp-wonder::after{content:"";inset:6%;border-radius:50%;background:radial-gradient(ellipse,rgba(255,246,174,.96),rgba(255,196,70,.42) 43%,transparent 72%);mix-blend-mode:screen;transform-origin:50% 0}
.post-lamp-wonder::before{content:"✦";z-index:2;left:46%;top:54%;color:#fff2a7;font-size:15px;text-shadow:-17px 12px #ffd56c,17px 8px #fff5bd}
.post-lamp-wonder.is-active::after{animation:postLampGlow 1.15s ease-out}.post-lamp-wonder.is-active::before{animation:postLampSpark 1.15s ease-out}

.post-letters-wonder::after{content:"✉";left:10%;top:48%;color:#fff6dc;font-size:clamp(17px,2vw,29px);text-shadow:95px -12px #f8dfb9,190px 7px #fff2d2,285px -16px #efd2a2;filter:drop-shadow(0 3px 2px rgba(75,48,28,.28))}
.post-letters-wonder.is-active::after{animation:postLetterFlock 1.35s cubic-bezier(.2,.75,.22,1)}

.post-vine-wonder::after{content:"❧";left:48%;top:20%;color:#759457;font-size:clamp(24px,3vw,43px);text-shadow:-33px 14px #5f854d,29px 18px #8aa45d,11px 43px #698b4c;filter:drop-shadow(0 3px 2px rgba(48,59,30,.25));transform-origin:50% 0}
.post-vine-wonder::before{content:"•";z-index:2;left:50%;top:43%;color:#90a864;font-size:21px;text-shadow:-18px 7px #708e51,19px 13px #a0b572}
.post-vine-wonder.is-active::after{animation:postVineRustle 1.15s ease-in-out}.post-vine-wonder.is-active::before{animation:postVineLeaves 1.3s ease-out}
.post-scene[data-scene-wonder-active="post-letters"] .flying-letter{opacity:1;animation-duration:1.7s;font-size:27px}

@media(max-width:850px){
  .post-shelves-wonder{left:0;top:0;width:34%;height:210px}
  .post-lamp-wonder{left:32%;top:60px;width:9%;height:68px}
  .post-letters-wonder{left:26%;top:0;width:72%;height:90px}
  .post-vine-wonder{left:78%;top:0;width:22%;height:112px}
}
@media(max-width:560px){
  .post-shelves-wonder{height:184px}
  .post-lamp-wonder{top:54px;height:62px}
  .post-letters-wonder{height:80px}
  .post-vine-wonder{height:98px}
}

@keyframes postShelfHop{0%,100%{opacity:0;transform:translateY(0) rotate(0)}20%{opacity:1;transform:translateY(-12px) rotate(-6deg)}48%{opacity:1;transform:translateY(3px) rotate(5deg)}72%{opacity:.8;transform:translateY(-5px) rotate(-2deg)}}
@keyframes postShelfGlow{0%,100%{opacity:0;transform:scale(.55)}35%,65%{opacity:1;transform:scale(1.2)}}
@keyframes postLampGlow{0%,100%{opacity:0;transform:scale(.7)}42%{opacity:1;transform:scale(1.14)}72%{opacity:.72;transform:scale(.96)}}
@keyframes postLampSpark{0%,100%{opacity:0;transform:scale(.6)}35%,66%{opacity:1;transform:translateY(-9px) scale(1.12)}}
@keyframes postLetterFlock{0%{opacity:0;transform:translate(-35px,20px) rotate(-12deg)}20%{opacity:1}100%{opacity:0;transform:translate(145px,75px) rotate(22deg) scale(1.08)}}
@keyframes postVineRustle{0%,100%{opacity:0;transform:rotate(0)}18%{opacity:1;transform:rotate(-7deg)}47%{opacity:1;transform:rotate(6deg)}73%{opacity:.75;transform:rotate(-3deg)}}
@keyframes postVineLeaves{0%{opacity:0;transform:translateY(-12px) rotate(0)}22%{opacity:1}100%{opacity:0;transform:translate(24px,75px) rotate(175deg)}}

@media(prefers-reduced-motion:reduce){.post-scene[data-scene-wonder-active="post-letters"] .flying-letter{animation-duration:13s;font-size:20px}}
[data-motion="reduced"] .post-scene[data-scene-wonder-active="post-letters"] .flying-letter{animation-duration:13s;font-size:20px}

/* Make the visible guest—not an extra overlay—the character touch target. */
.post-customer{pointer-events:none}
.post-customer img{pointer-events:auto;cursor:pointer;-webkit-tap-highlight-color:transparent}
#post-character:focus{outline:none!important}
#post-character:focus-visible{filter:drop-shadow(0 0 10px rgba(255,240,168,.98)) drop-shadow(0 6px 3px rgba(49,29,16,.28))}

/* The painted workbench is not itself a control. Only its real objects take
   taps, leaving the customer reachable where the transparent wrapper overlaps. */
.post-workbench{pointer-events:none}
.post-workbench .parcel-prop,.post-workbench .post-stamp,.post-workbench .delivery-lane{pointer-events:auto}

/* The three prices now have three visible travel personalities. The state and
   total still complete on the same reliable schedule; only the physical story
   differs. */
.delivery-lane.economy.delivering .vehicle{transition-duration:.92s;animation:postTurtleTrip .54s ease-in-out infinite alternate}
.delivery-lane.standard.delivering .vehicle{transition-duration:.56s;animation:postBikeTrip .3s ease-in-out infinite alternate}
.delivery-lane.express.delivering .vehicle{transition-duration:.3s;animation:postRocketTrip .18s ease-in-out infinite alternate}
.delivery-lane.express.delivering .vehicle::after{content:"✦ ·";position:absolute;right:78%;top:46%;width:65px;color:#ffe38a;font-size:18px;letter-spacing:8px;text-shadow:0 0 8px #ffcf65;animation:postRocketTrail .42s linear infinite}
@keyframes postTurtleTrip{to{transform:translateY(-61%) rotate(2deg) scale(1.025,.975)}}
@keyframes postBikeTrip{to{transform:translateY(-66%) rotate(4deg) scale(1.02,.98)}}
@keyframes postRocketTrip{to{transform:translateY(-61%) rotate(-3deg) scale(1.08,.94)}}
@keyframes postRocketTrail{from{opacity:.8;translate:8px 0}to{opacity:0;translate:-30px 4px}}
@media(prefers-reduced-motion:reduce){.delivery-lane.economy.delivering .vehicle,.delivery-lane.standard.delivering .vehicle,.delivery-lane.express.delivering .vehicle,.delivery-lane.express.delivering .vehicle::after{animation:none!important}}
[data-motion="reduced"] .delivery-lane.economy.delivering .vehicle,[data-motion="reduced"] .delivery-lane.standard.delivering .vehicle,[data-motion="reduced"] .delivery-lane.express.delivering .vehicle,[data-motion="reduced"] .delivery-lane.express.delivering .vehicle::after{animation:none!important}
.route-pen{width:clamp(74px,7vw,112px);height:clamp(28px,2.6vw,42px);border:0;border-radius:0;background:none;box-shadow:none;overflow:visible}
.route-pen::before,.route-pen::after{display:none}
.route-pen img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;filter:drop-shadow(0 4px 3px rgba(50,35,25,.32))}
.post-stamp{width:clamp(72px,7vw,104px);aspect-ratio:.75;padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible}
.post-stamp::before{display:none}
.post-stamp img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;filter:drop-shadow(0 8px 5px rgba(56,35,25,.36))}
.stamp-pad{z-index:12}
.parcel-shelf{z-index:11}
.service-marker{width:96px;height:34px;border:0;border-radius:0;background:center/contain no-repeat;box-shadow:none}
.service-marker::after{display:none}
.service-marker.economy{background-image:url('/post-pen-economy.webp')}
.service-marker.standard{background-image:url('/post-pen-standard.webp')}
.service-marker.express{background-image:url('/post-pen-express.webp')}

/* School trial visibility pass: make the three physical tools obvious at
   arm's-length on an iPad without adding any new instruction panels. */
.parcel-prop{width:clamp(132px,14vw,190px)}
.parcel-prop>span{font-size:clamp(72px,8vw,108px)}
.post-stamp{width:clamp(90px,8.8vw,128px)}
.route-pen{left:-4%;width:108%;height:100%}
.delivery-lane strong,.delivery-lane small{left:37%;width:40%}
@media(max-width:850px){
  .parcel-prop{width:clamp(138px,19vw,174px)}
  .post-stamp{top:-52%;width:clamp(90px,12vw,112px)}
  .route-pen{left:-6%;width:112%;height:104%}
}
@media(max-width:560px){
  .parcel-prop{width:124px}
  .parcel-prop>span{font-size:66px}
  .post-stamp{top:-54%;width:82px}
  .route-pen{left:-3%;width:106%;height:100%}
}

/* The three illustrated pens are now the route choices themselves. The old
   tracks and vehicles remain inert for delivery state compatibility but are
   no longer drawn over the post-office bench. */
.delivery-yard{top:17%;right:1%;width:60%;height:78%;gap:0}
.delivery-lane{min-height:72px;padding:0;border:0;background:none;text-align:left;overflow:visible}
.delivery-lane .track,.delivery-lane .vehicle{display:none}
.route-pen{left:36%;top:50%;width:62%;height:78%;transform:translateY(-50%) rotate(var(--pen-turn,-1deg));filter:drop-shadow(0 8px 5px rgba(54,35,23,.34))}
.delivery-lane.standard{--pen-turn:1deg}.delivery-lane.express{--pen-turn:-1deg}
.route-pen img{object-fit:contain}
.delivery-lane strong,.delivery-lane small{position:absolute;z-index:5;left:64%;width:25%;margin:0;color:#493724;text-align:center;line-height:1;pointer-events:none;text-shadow:0 2px 0 rgba(255,246,218,.96),1px 0 0 rgba(255,246,218,.96),-1px 0 0 rgba(255,246,218,.96)}
.delivery-lane strong{top:29%;font-size:clamp(15px,1.35vw,21px)}
.delivery-lane small{top:54%;font-size:clamp(13px,1.15vw,17px);font-weight:1000}
.delivery-lane em{position:absolute;z-index:6;right:0;bottom:0;max-width:28%;font-size:clamp(10px,.8vw,13px);text-align:center}
.delivery-lane:hover,.delivery-lane:focus-visible{transform:translateY(-3px);filter:brightness(1.08) saturate(1.08)}
.delivery-lane.selected .route-pen{filter:drop-shadow(0 0 13px #ffe16e) drop-shadow(0 8px 5px rgba(54,35,23,.34))}
.delivery-lane.wrong .route-pen{filter:grayscale(.2) sepia(.3) drop-shadow(0 0 11px #d74f54)}
.delivery-lane.unavailable .route-pen{filter:grayscale(.8);opacity:.58}
@media(max-width:850px){.delivery-yard{top:48%;right:2%;width:62%;height:48%}.delivery-lane{min-height:76px}.delivery-lane strong{font-size:16px}.delivery-lane small{font-size:14px}}
@media(max-width:560px){.delivery-yard{top:45%;right:1%;width:64%;height:49%}.delivery-lane{min-height:76px}.delivery-lane strong{left:64%;width:25%;font-size:15px}.delivery-lane small{left:64%;width:25%;font-size:13px}}