/* Quiet settlement and the playable forest trail. Existing portraits remain unchanged. */
.modal.completion-modal{width:min(370px,100%);padding:12px 12px 6px;border-width:4px;border-radius:28px;color:#4e6147}
.completion-modal .delivery-scene{position:relative;isolation:isolate;height:158px;border-radius:18px;overflow:hidden;background:linear-gradient(#f0f3df 58%,#dce6c5 58%)}
.delivery-scene:before,.delivery-scene:after{content:"";position:absolute;z-index:-1;background:#c1d1a6;width:31px;height:71px;border-radius:65% 65% 45% 45%;left:3%;top:39px;transform:rotate(-6deg)}
.delivery-scene:after{left:auto;right:2%;top:63px;height:57px;width:24px}
.delivery-road{position:absolute;left:8%;bottom:-4px;width:90%;height:63px;border:12px solid #eee5c8;border-radius:50%;rotate:-7deg}
.delivery-homes{position:absolute;inset:41px 18px 28px;display:flex;gap:12px;justify-content:space-around;align-items:flex-end}
.delivery-home{position:relative;width:43px;height:65px;flex:0 1 43px}
.delivery-home:nth-child(2n){align-self:flex-start}
.delivery-cottage{position:absolute;bottom:0;inset-inline:0;height:38px;background:#fff6df;border-radius:4px;box-shadow:0 3px #b7bea0}
.delivery-cottage:before{content:"";position:absolute;inset:-24px -5px auto;height:26px;background:var(--home-color);clip-path:polygon(50% 0,100% 92%,97% 100%,3% 100%,0 92%)}
.delivery-cottage:after{content:"";position:absolute;width:12px;height:20px;bottom:0;right:7px;border-radius:7px 7px 0 0;background:#9cad86}
.delivery-neighbor{position:absolute;left:-1px;top:-10px}
.delivery-neighbor .animal-portrait{width:38px;height:38px;filter:drop-shadow(0 2px 1px #53644018)}
.delivery-check{position:absolute;right:-9px;top:-16px;width:20px;height:20px;display:grid;place-items:center;background:#7f986e;color:#fffced;border-radius:50%;font-size:13px}
.delivery-parcel{position:absolute;bottom:-1px;left:-4px;width:13px;height:11px;border-radius:1px;background:linear-gradient(90deg,#c19a64 40%,#f4dfb3 40% 59%,#c19a64 59%);border-top:2px solid #efd6a5}
.completion-modal h2{font-size:27px;margin:22px 0 0;letter-spacing:.5px}
.delivery-reward{display:inline-flex;align-items:center;gap:11px;margin:16px 0 20px;padding:7px 15px;background:#f2ebcd;border-radius:28px;color:#896c2f}
.delivery-reward>span{font-size:12px}.delivery-reward b{font-size:22px;font-weight:650}.delivery-coin{display:inline-grid;place-items:center;width:19px;height:19px;border:1px solid #b29955;border-radius:50%;font-size:13px;vertical-align:2px}
.completion-modal #result-map{width:calc(100% - 20px);margin:0 10px;min-height:50px;font-size:15px;background:#7d966f;border-radius:14px}.completion-modal #result-map>span{margin-left:10px}
.completion-modal p.delivery-card-reward{font-size:12px;margin:-8px 0 17px;color:#766c43}
.delivery-details{margin:0 10px}.delivery-details summary{min-height:45px;display:flex;justify-content:center;align-items:center;font-size:12px;color:#748168;cursor:pointer;list-style:none;border-radius:8px}.delivery-details summary::-webkit-details-marker{display:none}.delivery-details summary:after{content:"⌄";padding-left:6px}.delivery-details[open] summary:after{content:"⌃"}.delivery-details summary:focus-visible{outline:3px solid #7e9874;outline-offset:-3px}
.delivery-details>div{padding:9px 0 12px;border-top:1px solid #e3e6d6}.delivery-details h3{font-size:15px;margin:4px 0 8px}.delivery-details p{color:#75816c;font-size:12px;margin:7px 0}.delivery-details #claim-card{min-height:44px;color:#716137;background:#f2ebcd}
.has-animal-unlock h2{margin-top:12px}.has-animal-unlock .delivery-reward{margin:12px 0 16px}
.delivery-unlocks{display:grid;gap:12px;margin:0 10px 16px}
.animal-unlock{display:grid;justify-items:center;padding:15px 10px 14px;border:1px solid #dfd8ac;border-radius:20px;background:radial-gradient(ellipse at 50% 30%,#fffdf1 0%,#f4efd5 75%);box-shadow:inset 0 0 0 4px #fffaf0;color:#56694b}
.unlock-caption{font-size:11px;letter-spacing:3px;color:#8e7540}
.unlock-portrait{display:grid;place-items:center;width:128px;height:128px;margin:8px 0 7px;border-radius:50%;background:#fffaf0;box-shadow:0 4px 15px #9e915718}
.unlock-portrait .animal-portrait{width:120px;height:120px;filter:drop-shadow(0 3px 2px #745a3420)}
.animal-unlock h3{font-size:19px;margin:3px 0 0;font-weight:700}.modal .animal-unlock p{font-size:12px;color:#7a8062;margin:7px 0 0;line-height:1.5}
.unlock-reveal .animal-unlock{animation:animal-unlock-reveal .65s ease-out both;transform-origin:50% 65%}
@keyframes animal-unlock-reveal{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
.animal-memories{display:grid;gap:10px;margin:0 0 20px}.animal-memory{display:flex;align-items:center;gap:12px;text-align:left;padding:10px 12px;border:1px solid #dfd8ac;border-radius:16px;background:#f7f1dc}.animal-memory .animal-portrait{width:58px;height:58px}.animal-memory b{font-size:13px;color:#56694b}.modal .animal-memory small{display:block;margin-top:6px;font-size:11px;line-height:1.5;color:#7a8062}
.reduced .unlock-reveal .animal-unlock{animation:none}
@media(prefers-reduced-motion:reduce){.unlock-reveal .animal-unlock{animation:none}}
@media(max-height:600px){.has-animal-unlock h2{font-size:24px;margin-top:8px}.has-animal-unlock .delivery-reward{margin:8px 0 12px}.animal-unlock{padding-block:12px}.unlock-portrait{width:104px;height:104px;margin-block:6px}.unlock-portrait .animal-portrait{width:98px;height:98px}}
@media(max-height:500px){.has-animal-unlock .delivery-unlocks{margin-bottom:12px}.has-animal-unlock .animal-unlock{grid-template-columns:88px minmax(0,1fr);grid-template-rows:auto auto auto;column-gap:10px;align-items:center;padding:12px 10px}.has-animal-unlock .unlock-portrait{grid-column:1;grid-row:1 / 4;width:88px;height:88px;margin:0}.has-animal-unlock .unlock-portrait .animal-portrait{width:84px;height:84px}.has-animal-unlock .unlock-caption,.has-animal-unlock .animal-unlock h3,.has-animal-unlock .animal-unlock p{grid-column:2;margin:0}.has-animal-unlock .unlock-caption{font-size:10px;letter-spacing:1px}.has-animal-unlock .animal-unlock h3{font-size:17px}.has-animal-unlock .animal-unlock p{font-size:11px}}
.modal.forest-modal{width:min(520px,100%);height:min(940px,calc(100dvh - 36px));max-height:calc(100dvh - 36px);padding:0;border-width:4px;display:flex;flex-direction:column;overflow:hidden;text-align:center;background:#fffae9}
.trail-header{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-shrink:0;padding:10px 12px;background:#fffae9;position:relative;z-index:2;box-shadow:0 3px 12px #6d684812}
.trail-header h2{font-size:22px;letter-spacing:2px;margin:0;color:#3f6547}.trail-header p{margin:4px 0 0;color:#7b8266;font-size:11px;line-height:1.4}
.modal .trail-header button{margin:0;width:44px;min-height:44px;padding:4px;border-radius:50%;background:#ede6cf;color:#63784e;font-size:12px}.modal .trail-header #forest-home{font-size:27px}
.trail-viewport{min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b1bc91 #e8eccf;overflow-anchor:none}
.trail-stage{position:relative;aspect-ratio:941 / 1672;width:100%;isolation:isolate;background:#dfebce}
.trail-art{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;user-select:none;z-index:-2}
.trail-fallback{position:absolute;inset:0;display:none;z-index:-1;background:radial-gradient(ellipse at 5% 24%,#9fb88d 5%,transparent 37%),radial-gradient(ellipse at 95% 70%,#acc495 5%,transparent 35%),#e4ebd1}.art-unavailable .trail-fallback{display:block}.art-unavailable .trail-fallback:after{content:"";position:absolute;inset:15% 27% 2%;border:24px solid #f6e7ba;border-radius:50% 30% 45% 20%;rotate:7deg}
.trail-levels{position:absolute;inset:0;pointer-events:none}
.modal .trail-stop{position:absolute;left:var(--stop-x);top:var(--stop-y);transform:translate(-50%,-50%);width:51px;height:48px;min-height:44px;margin:0;padding:0;border:3px solid #d1d4bf;border-radius:50%;background:linear-gradient(145deg,#b7bbad,#898e83);box-shadow:0 4px 0 #787e6b,0 6px 7px #3f58342b;color:#fffdf0;pointer-events:auto;opacity:1;font-size:24px;z-index:2}
.trail-stop b{font-weight:750;text-shadow:0 1px 2px #3c503840}.modal .trail-stop.postmarked{border-color:#dce8ba;background:linear-gradient(135deg,#9ab774,#6a955a);box-shadow:0 4px 0 #668252,0 6px 9px #3f583430}
.modal .trail-stop.trail-next{border-color:#f5dfa0;background:linear-gradient(135deg,#accd7f,#759f5b);box-shadow:0 4px 0 #64864b,0 0 15px #fff3aecc}
.modal .trail-stop[aria-pressed="true"]{outline:3px solid #ffe493;outline-offset:3px;z-index:4;box-shadow:0 4px 0 #67854a,0 0 0 8px #fff7bc7a,0 5px 20px #f5d36c88}
.modal .trail-stop:focus-visible{outline:3px solid #345b3a;outline-offset:6px}
.trail-stop-status{position:absolute;right:-7px;bottom:-7px;display:grid;place-items:center;border:2px solid #fffce7;width:22px;height:22px;border-radius:50%;background:#6e905c;color:#fffceb;font-size:14px}.trail-stop-status:empty{display:none}.trail-stop:disabled .trail-stop-status{background:#83867b}.trail-stop-status svg{width:12px;height:12px}
.trail-next-label{position:absolute;left:50%;top:-24px;transform:translateX(-50%);border-radius:5px;background:#3f6746;color:#fffae8;padding:3px 7px;font-size:10px;line-height:1.4;white-space:nowrap}
.modal .trail-home{position:absolute;left:var(--home-x);top:var(--home-y);transform:translate(-50%,-50%);width:auto;max-width:30%;min-width:72px;min-height:44px;margin:0;padding:5px 7px;border-radius:9px;background:#fff8e7ee;border:1px solid #ceb990;box-shadow:0 3px 9px #34533326;font-size:11px;color:#586d42;z-index:1}
.trail-home>span{white-space:nowrap}.trail-home small{display:block;font-size:10px;color:#7a7655;margin-top:1px}.trail-home b svg{width:11px;height:11px;vertical-align:-1px}.modal .trail-home.unknown{opacity:1;background:#e7e5d7;color:#75796c}
.trail-otter{position:absolute;bottom:95%;left:50%;transform:translateX(-50%);pointer-events:none}.trail-otter .animal-portrait{width:52px;height:52px}.trail-otter>svg:not(.animal-portrait){width:22px;height:22px;color:#6d7966;background:#f0eddc;border:3px solid #f0eddc;border-radius:6px}
.trail-controls{flex-shrink:0;padding:10px 17px 12px;background:#fffae9;z-index:5;box-shadow:0 -5px 16px #5b674b16}
#forest-selection{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px 10px;min-height:29px;margin-bottom:4px;font-size:12px;color:#7c7d64}#forest-selection strong{font-size:17px;color:#466548}#forest-selection span{line-height:1.4}
.modal .trail-controls #forest-continue{margin-top:6px;min-height:49px;background:#69874d;border:2px solid #809a62;border-radius:16px;color:#fff8e6;font-size:17px;font-weight:650;box-shadow:0 3px 0 #4d6b3e;letter-spacing:1px}
.modal .trail-controls .text-button{min-height:35px;font-size:11px;margin-top:7px;padding:5px}.modal .trail-arrival{margin:0 0 5px;font-size:11px;line-height:1.5;color:#59763e}.trail-arrival[hidden]{display:none}
.just-delivered .trail-stop-status{animation:trail-stamp .6s ease-out both}.just-unlocked{animation:trail-unlock .8s ease-out both}
@keyframes trail-stamp{from{opacity:0;scale:1.8;rotate:-25deg}to{opacity:1;scale:1;rotate:0deg}}
@keyframes trail-unlock{from{filter:grayscale(1);opacity:.5}to{filter:grayscale(0);opacity:1}}
.reduced .just-delivered .trail-stop-status,.reduced .just-unlocked{animation:none}
@media(prefers-reduced-motion:reduce){.just-delivered .trail-stop-status,.just-unlocked{animation:none}}
@media(max-width:360px){.modal.forest-modal{border-width:3px}.trail-header{padding:7px 9px}.trail-header h2{font-size:20px}.trail-controls{padding:8px 12px 11px}.modal .trail-home{min-width:63px;padding:4px 5px;font-size:10px}.modal .trail-stop{width:46px;height:44px;font-size:22px}.delivery-homes{gap:10px;inset-inline:12px}.delivery-neighbor .animal-portrait{width:32px;height:34px}.completion-modal .delivery-scene{height:146px}}
@media(max-height:500px){.completion-modal .delivery-scene{height:104px}.completion-modal h2{font-size:23px;margin-top:14px}.delivery-reward{margin:10px 0 13px}.delivery-homes{inset-block:20px 18px}.trail-header{padding:5px 10px}.trail-header p{margin-top:2px}.trail-controls{padding-block:6px 10px}.trail-controls #forest-selection{min-height:23px;margin:0}.modal .trail-controls #forest-continue{min-height:44px;margin-top:3px}}
@media(max-height:500px){.modal.completion-modal.has-animal-unlock{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;width:min(480px,100%);padding:8px 12px 4px}.has-animal-unlock h2{margin:3px 0}.has-animal-unlock .delivery-reward{margin:0 10px 8px;padding:4px 12px}.has-animal-unlock .delivery-unlocks{grid-column:1 / -1;margin:4px 10px 10px}.has-animal-unlock .delivery-card-reward,.has-animal-unlock #result-map,.has-animal-unlock .delivery-details{grid-column:1 / -1}}
