/* The approved F4 styles stay immutable; full-experience additions live here. */
.scene[data-screen]:not([data-screen=activity])>.distant-town,.scene[data-screen]:not([data-screen=activity])>.phone-tabletop{display:none}
#activity-screen{display:contents}.scene header{position:static}.scene[data-screen]:not([data-screen=activity]) .map-progress{display:none}
.scene[data-screen=welcome] .back{display:none}
.scene[data-screen=completion]{overflow:auto;background:#eaf9ef url('assets/snack-discovery-town-tablet-completion-background-v1.png') center/cover fixed}
.welcome-screen,.map-screen{position:absolute;inset:0;z-index:0;background:#d9f4eb}
.welcome-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.welcome-screen{display:flex;align-items:center;justify-content:center;background:#c5ece4}
.welcome-board{position:relative;width:min(100cqw,177.68cqh);height:min(56.28cqw,100cqh)}
.adventure-title{position:absolute;left:23%;top:7%;width:49%;height:35%;object-fit:contain;filter:drop-shadow(0 3px 2px #203f4d35)}
.play{position:absolute;left:37%;top:45%;width:26%;height:13%;min-height:60px;font-size:clamp(28px,5cqw,56px);font-weight:700;display:flex;align-items:center;justify-content:center;gap:22px}
.play span{font-size:.65em}.scene .gear,.scene .back{z-index:12}
.map-screen{display:flex;align-items:center;justify-content:center;background:#c4eee4;overflow:hidden}
.map-board{position:relative;width:min(100cqw,177.68cqh);height:min(56.28cqw,100cqh);flex:none;isolation:isolate}
.map-art{position:absolute;inset:0;width:100%;height:100%}
.checkpoint{position:absolute;transform:translate(-50%,-100%);font-size:clamp(14px,2.15cqw,26px);font-weight:700;text-align:center;background:linear-gradient(#fffdf3,#daf5ee);border:2px solid #48b6b8;border-radius:14px;padding:5px 13px;box-shadow:0 3px 4px #1c645b40;white-space:nowrap}
.checkpoint span{display:block;font-size:.73em}.checkpoint b{position:absolute;right:-14px;top:-16px;color:#e9b231;font-size:36px;filter:drop-shadow(0 0 3px #fff7b9)}
.c1{left:20%;top:34%}.c2{left:50.5%;top:40%}.c3{left:84%;top:44%}
.checkpoint.current{border:3px solid #078c94;box-shadow:0 0 0 3px #fff3ad}.map-heading{position:absolute;top:15%;left:28%;width:44%;margin:0;text-align:center;font-size:clamp(22px,3cqw,40px);background:#fff8e6ed;border:1px solid #e5bf70;border-radius:14px;padding:8px}
.map-continue{position:absolute;bottom:5%;left:36%;width:28%;min-height:48px;font-size:clamp(18px,2.5cqw,30px);padding:7px 14px}.map-continue:disabled{opacity:.7}
.map-truck{position:absolute;left:0;top:55%;width:15%;aspect-ratio:1.5;transform:translate(-50%,-88%);filter:drop-shadow(0 4px 2px #416a4e55);will-change:left,top}
.map-truck>img{width:100%;height:100%;object-fit:contain}.wheel{position:absolute;background:repeating-conic-gradient(#f5d9a8 0deg 12deg,#9b6243 12deg 24deg,#f7d5a2 24deg 36deg);border:1px solid #80552a;border-radius:50%;width:5.8%;height:11%;box-shadow:inset 0 0 0 2px #f3d0a4}
.wheel.rear{left:14.3%;top:65%}.wheel.front{left:48.7%;top:79.8%}.wheel::after{content:'';position:absolute;inset:25%;border-radius:50%;background:#f59030;border:1px solid #d87518}
.map-truck.driving .wheel{animation:wheel-spin .38s linear infinite}.map-truck.driving>img{animation:truck-bob .45s ease-in-out infinite alternate}
@keyframes wheel-spin{to{transform:rotate(360deg)}}@keyframes truck-bob{to{transform:translateY(-1.5px)}}
.mist{position:absolute;inset:-20%;background:radial-gradient(ellipse at 35% 50%,#fffffff2,transparent 65%),radial-gradient(ellipse at 65% 50%,#e8fff4ed,transparent 60%);filter:blur(15px);z-index:20;pointer-events:none;animation:mist-sweep 700ms ease-in-out both}
@keyframes mist-sweep{0%{transform:translateX(-95%);opacity:0}45%{opacity:1}100%{transform:translateX(95%);opacity:0}}
.food{gap:7%}.food[data-count="1"]>img,.food[data-count="1"]>.count-apple{width:56%}.food[data-count="2"]>img,.food[data-count="2"]>.count-apple{width:43%}.food[data-count="3"]>img,.food[data-count="3"]>.count-apple{width:28%}
.food>.count-apple{position:relative;height:100%;border:0;background:none;padding:0;min-width:44px;min-height:44px;border-radius:20px;flex:none}.count-apple img{width:100%;height:100%;object-fit:contain;object-position:bottom;pointer-events:none}.count-apple:disabled{opacity:1}.count-mark{position:absolute;top:0;right:0;background:#0d9475;color:#fff;border:2px solid #edfff1;border-radius:50%;min-width:30px;min-height:30px;font-size:24px;line-height:1.05;padding:2px;box-shadow:0 2px 3px #124d4550}.count-apple.counted img{filter:drop-shadow(0 0 6px #71e6a0)}
.count-apple.tapped{animation:apple-tap 160ms ease-out}@keyframes apple-tap{45%{transform:translateY(-4px) scale(1.03)}}
.food.count-cue img:nth-child(3){animation-delay:1450ms}.scene[data-activity=F3] .instruction{font-size:calc(2.65 * var(--u))}
.scene[data-activity=F1] .food{top:50%;height:29%}.scene[data-activity=F1] .next{bottom:6%}
.progress-art .earned-fill{transition:width 250ms}.completion-screen{position:relative;min-height:100%;padding:65px 4% 24px;background:#f2ffed55}
.completion-heading{display:flex;align-items:center;justify-content:center;gap:12px;height:115px}.completion-heading img{height:115px;width:100px;object-fit:contain}.completion-heading h1{margin:0;font-size:clamp(32px,4cqw,54px);color:#075555}
.completion-grid{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(230px,.85fr);gap:3%;align-items:center;max-width:1200px;margin:0 auto}.completion-grid>canvas{width:100%;height:auto;aspect-ratio:1426/1103;border-radius:15px;box-shadow:0 4px 16px #175a5c44;background:#fffdf3}
.completion-controls{background:#fffdf0ed;border:1px solid #b1ded5;border-radius:20px;padding:15px 20px;display:flex;flex-direction:column;gap:10px;box-shadow:0 4px 12px #2e70582b}.completion-controls p{margin:0;font-size:17px}.completion-controls label{font-size:20px}.completion-controls input{width:100%;font:inherit;font-size:22px;padding:9px;border:2px solid #6caeaa;border-radius:10px;min-height:44px;color:#134c52;background:white}.completion-action{position:relative;min-height:48px;width:100%;font-size:22px;padding:8px 12px;border-radius:12px}.download{background:linear-gradient(#eaffdb,#bdeed9);border:2px solid #168c83;color:#124e4f}.completion-controls small{text-align:center;font-size:15px}#download-status:empty,#photo-status:empty{display:none}
#photo-dialog{max-width:min(94vw,520px);width:520px}#photo-dialog p{font-size:16px;margin:5px}#photo-crop-preview{display:block;max-width:220px;width:44vh;height:auto;aspect-ratio:1;margin:8px auto;border:2px solid teal;border-radius:50%;touch-action:none;cursor:grab;background:#e5f3ed}#photo-zoom{display:block;width:100%;min-height:36px;margin:0}#photo-dialog label{display:block;font-size:18px}.photo-actions{display:flex;gap:10px}.photo-actions button{min-height:44px;min-width:0;flex:1;padding:6px;font-size:18px;border-radius:10px}
@media(max-height:500px) and (orientation:landscape){
 .adventure-title{top:3%;height:38%}.play{top:44%;height:16%;min-height:52px}.scene[data-activity=F3] .instruction{font-size:21px;line-height:1.04}.scene[data-activity=F1] .food{top:42%;height:32%}
 .scene:not([data-activity=F1])[data-fruit=Apple] .food,.scene[data-fruit=Pear] .food{top:40%;height:16%}
 .completion-screen{padding:54px 4% 20px}.completion-heading{height:78px}.completion-heading img{height:78px}.completion-heading h1{font-size:34px}.completion-grid{grid-template-columns:minmax(0,1.5fr) minmax(220px,1fr);align-items:start}.completion-controls{gap:8px;padding:12px 14px}.completion-controls label{font-size:18px}.completion-action{font-size:19px;min-height:44px}.map-heading{top:16%;font-size:24px;padding:5px}.map-continue{bottom:3%}
 #photo-dialog{padding:10px 20px}#photo-dialog h2{font-size:22px;margin:0}#photo-crop-preview{max-width:125px;width:28vh;margin:3px auto}.photo-actions button{min-height:40px}
}
@media(max-width:760px) and (orientation:landscape){.completion-grid{grid-template-columns:1fr;max-width:570px;gap:18px}.completion-controls{margin-top:18px}.completion-grid>canvas{width:85%;margin:auto}}
@media(orientation:portrait){.completion-screen{display:none}.welcome-screen,.map-screen{visibility:hidden}}
@media(prefers-reduced-motion:reduce){.map-truck.driving .wheel,.map-truck.driving>img,.mist{animation:none!important}.mist{display:none!important}}