/* A folded street map with a shaded miniature neighbourhood. */
.shadow-home{--shade:#347b78;--shade-ink:#254f54;display:grid;grid-template-columns:1.15fr 1fr;gap:22px 42px;padding:28px 0 62px;color:var(--shade-ink);align-items:start}.shadow-name{grid-column:1;grid-row:1;text-align:center;min-width:0}.shadow-kicker{font-size:10px;letter-spacing:.08em;color:#68898a}.shadow-name h1{font-size:clamp(36px,5vw,62px);line-height:1.08;letter-spacing:-.04em;margin:10px 0}.shadow-name>p{font-size:14px;color:#577d7d}.shadow-next{grid-column:2;grid-row:1/span 2;min-width:0;position:relative;padding:26px;background:repeating-linear-gradient(90deg,transparent 0 32%,#659e9322 32.2% 32.7%,transparent 33% 66%,#ffffff80 66.2% 66.8%,transparent 67% 100%),#eff5e3;clip-path:polygon(0 2%,33% 0,66% 2%,100% 0,100% 98%,66% 100%,33% 98%,0 100%);filter:drop-shadow(0 5px 4px #3b69631b)}.shadow-route-heading{display:flex;justify-content:space-between;gap:12px;margin-bottom:19px;font-size:11px;color:#5d8381}.shadow-route-heading b{font:500 12px ui-monospace,monospace}.shadow-next h2{font-size:29px;line-height:1.2;margin-bottom:12px;overflow-wrap:anywhere}.shadow-next>p{font-size:14px;line-height:1.55;color:#557775}.shadow-start{width:100%;display:flex;justify-content:space-between;min-height:56px;margin-top:20px;border-radius:32px;background:var(--shade);box-shadow:0 4px 0 #235a60}.shadow-start>span:last-child{font-size:24px}.shadow-pocket{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;padding-top:15px;margin-top:20px;border-top:1px dashed #9bbab0;font-size:10px;color:#527575}.shadow-pocket b{font-size:12px;color:#315c5d}.shadow-street-note{grid-column:1;grid-row:3;text-align:center;color:#678784;font-size:12px;line-height:1.6;padding:0 16px}.shadow-actions{grid-column:2;grid-row:3;display:flex;flex-wrap:wrap;gap:8px;align-self:center}.shadow-actions .quiet{flex:1;min-height:44px;padding:12px 8px;font-size:11px;color:#4d7978;background:#edf3df;border-color:#bbcec0}.shadow-map{grid-column:1/-1;grid-row:4;width:100%;max-width:850px;margin:12px auto 0;padding-inline:18px;border-inline-start:2px dashed #adc9ba}.shadow-map-heading{margin-bottom:22px}.shadow-map-heading h2{font-size:28px}.shadow-map-heading p{font-size:12px;margin-top:6px;color:#6d928a}.shadow-zone{padding:5px 0;border-bottom:1px dashed #bed0bc}.shadow-zone>summary{display:flex;align-items:center;gap:14px;min-height:70px;padding:10px 0;list-style:none;cursor:pointer}.shadow-zone>summary::-webkit-details-marker{display:none}.shadow-map-pin{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:39px;height:43px;border-radius:50% 50% 50% 3px;background:#e0ecdb;border:2px solid #a1bdb0;color:#52786e;font:16px ui-monospace,monospace}.shadow-zone-cooled .shadow-map-pin{background:#91beb1;border-color:#6fa59b;color:#274f50}.shadow-zone summary>span:nth-child(2){flex:1}.shadow-zone summary b{font-size:15px;display:block}.shadow-zone summary small{display:block;font-size:10px;margin-top:4px;color:#759386}.shadow-zone summary>i{font-style:normal;font-size:22px;color:#7ba094}.shadow-route-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:6px 0 20px}.shadow-home .shadow-stop{min-height:92px;height:auto;min-width:0;display:flex;flex-direction:column;gap:5px;padding:10px 7px;border-radius:20px 5px;background:#f0f4e4;border:1px solid #c4d3bb;color:#50766b}.shadow-stop b{font:600 15px ui-monospace,monospace}.shadow-stop>span{font-size:10px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.shadow-stop small{font-size:10px;color:#719283;margin-top:auto}.shadow-home .shadow-stop.current{outline:2px solid #68a99d;outline-offset:-1px;background:#c5e4d7;border-color:#68a99d}.shadow-home .shadow-stop.completed{background:#dfebce;border-color:#b3c5a2}.shadow-stop:disabled{opacity:.5}.shadow-secondary{grid-column:1/-1;width:100%;max-width:850px;margin:5px auto 0;border-top:1px solid #ccdccd}.shadow-secondary>summary{font-size:12px;color:#64837b;min-height:44px;padding:12px 0;cursor:pointer}.shadow-secondary>div{padding:12px 0}.shadow-zone>summary:focus-visible,.shadow-secondary>summary:focus-visible{outline:3px solid #4f8e87;outline-offset:2px}
.shadow-street{grid-column:1;grid-row:2;position:relative;isolation:isolate;height:325px;margin:0;overflow:hidden;direction:ltr;border-radius:100px 30px 90px 24px;background:#d8e9d3;border:5px solid #eef4df;box-shadow:0 11px 0 #cadcc61a;perspective:650px}.shadow-sky{position:absolute;inset:0;background:linear-gradient(#d9e8d7,#f3e9bc 63%,#dce1ba 64%)}.shadow-sun{position:absolute;width:46px;height:46px;right:13%;top:20px;border-radius:50%;background:#f3d57d;box-shadow:0 0 0 11px #f5dc9044}.shadow-town{position:absolute;left:8%;right:7%;bottom:94px;display:flex;align-items:end;gap:15px}.shadow-town>i{position:relative;display:block;width:83px;height:112px;border-radius:5px 5px 0 0;background:repeating-linear-gradient(90deg,transparent 0 12px,#89aaa0 13px 25px,transparent 26px 40px) 0 20px/100% 20px,#c1cfba;border-top:8px solid #9bb4a2}.shadow-town>i:nth-child(2){height:137px;background-color:#d8cbaa}.shadow-town>i:nth-child(3){height:94px}.shadow-pavement{position:absolute;left:-10%;right:-10%;bottom:0;height:101px;background:repeating-linear-gradient(90deg,transparent 0 53px,#b8cbb250 54px 56px),#d4ddbd;transform:rotateX(12deg)}.shadow-trail{position:absolute;left:14%;right:12%;height:65px;bottom:27px;border:3px dashed #aac5b0;border-bottom:0;border-radius:50%;transform:rotate(-13deg)}.shadow-first-cover,.shadow-new-umbrella{position:absolute;left:26%;bottom:53px;width:98px;height:126px}.shadow-first-cover:after,.shadow-new-umbrella:after{content:"";position:absolute;width:90px;height:30px;left:20px;bottom:-9px;background:#658e8259;border-radius:50%;transform:skewX(-18deg)}.shadow-first-cover i,.shadow-new-umbrella i{position:absolute;width:94px;height:45px;border-radius:90px 90px 9px 9px;top:10px;left:0;background:conic-gradient(from 245deg at 50% 100%,#98b2a3 0 35deg,#608f85 35deg 75deg,#98b2a3 75deg 110deg,#608f85 110deg 160deg,#98b2a3 160deg);border-bottom:5px solid #557f73;z-index:2}.shadow-first-cover b,.shadow-new-umbrella b{position:absolute;width:5px;height:79px;left:45px;top:47px;background:#88977b;transform:rotate(5deg);transform-origin:top}.shadow-new-umbrella{left:2%;bottom:45px;transform:scale(.65);transform-origin:bottom center}.shadow-new-umbrella i{filter:hue-rotate(25deg)}.shadow-ice{position:absolute;width:37px;height:43px;left:48%;bottom:44px;transform:rotate(7deg);border-radius:10px 13px 9px 12px;background:linear-gradient(135deg,#eafafa,#a0d6d9);border:2px solid #79b5ba;box-shadow:inset -6px -6px 0 #77b9c32c,5px 6px 0 #729b871f;animation:shadow-ice-breathe 4s ease-in-out infinite}.shadow-ice:before{content:"";position:absolute;width:6px;height:5px;border-radius:50%;left:9px;top:17px;background:#487982;box-shadow:13px 0 0 #487982}.shadow-ice i{position:absolute;left:15px;top:25px;width:9px;height:5px;border-bottom:2px solid #54868c;border-radius:50%}.shadow-ice b{position:absolute;left:6px;top:5px;width:9px;height:5px;background:#ffffffbb;border-radius:50%;transform:rotate(-25deg)}.shadow-cold-door{position:absolute;right:12%;bottom:92px;width:36px;height:54px;border:4px solid #7eada1;border-radius:6px;background:#deefe0}.shadow-cold-door i{position:absolute;width:3px;height:10px;left:4px;top:20px;background:#81aca1}.shadow-tree{position:absolute;right:3%;bottom:50px;width:74px;height:139px}.shadow-tree:after{content:"";position:absolute;width:84px;height:28px;left:5px;bottom:-10px;border-radius:50%;background:#507c6d44}.shadow-tree b{position:absolute;width:9px;height:85px;left:32px;bottom:0;background:#9c9b77}.shadow-tree i{position:absolute;inset:0 0 38px;border-radius:50% 50% 45% 40%;background:#84ad86;box-shadow:inset -15px -8px 0 #699773}.shadow-fountain{position:absolute;left:11%;bottom:22px;width:41px;height:45px;background:#a2b8a8;border-radius:15px 15px 5px 5px;border-bottom:8px solid #8aab9d}.shadow-fountain i{position:absolute;left:16px;top:-9px;width:5px;height:27px;border-radius:50%;background:#c8ebe1;animation:shadow-water 2s ease-in-out infinite}.shadow-fountain b{position:absolute;left:4px;right:4px;bottom:9px;height:8px;border-radius:50%;background:#bce0d3}.shadow-market{position:absolute;right:21%;bottom:69px;width:60px;height:66px;border:4px solid #a8ae84;border-top:0}.shadow-market i{position:absolute;left:-8px;right:-8px;top:-6px;height:18px;border-radius:5px;background:repeating-linear-gradient(90deg,#86ac92 0 12px,#e9e6be 12px 24px)}.shadow-market b{position:absolute;left:-6px;right:-6px;bottom:13px;height:10px;background:#bac297}.shadow-pergola{position:absolute;left:10%;right:4%;top:92px;height:102px;border-left:5px solid #95a37c;border-right:5px solid #95a37c}.shadow-pergola i{position:absolute;left:-9px;right:-9px;top:-9px;height:17px;background:repeating-linear-gradient(90deg,#7d9c76 0 12px,#a4bc8b 12px 21px);border-radius:15px}.shadow-pergola b{position:absolute;left:-10px;top:0;width:25px;height:68px;border-left:10px dotted #92ae7d;border-radius:40%}.shadow-garland{position:absolute;left:9%;right:9%;top:68px;height:30px;display:flex;justify-content:space-around;border-top:2px solid #85a07a;transform:rotate(-5deg)}.shadow-garland i{width:17px;height:23px;background:#e7ce89;clip-path:polygon(0 0,100% 0,50% 100%)}.shadow-garland i:nth-child(2n){background:#84b7a4}.shadow-neighbour{position:absolute;right:16%;bottom:14px;width:25px;height:55px}.shadow-neighbour i{position:absolute;left:5px;top:0;width:18px;height:18px;border-radius:50%;background:#d2b08a;border-top:5px solid #7c8c6a}.shadow-neighbour b{position:absolute;left:2px;top:17px;width:24px;height:34px;background:#b7b77e;border-radius:10px 10px 3px 3px;border-bottom:8px solid #829b83}.shadow-district-4 .shadow-sky,.shadow-district-5 .shadow-sky{background:linear-gradient(#c1cbbd,#efd8b7 63%,#ccd6b7 64%)}.shadow-grown-6 .shadow-pavement{background-color:#c1d7b5}
[dir=rtl] .shadow-name h1,[dir=rtl] .shadow-kicker{letter-spacing:0}[dir=rtl] .shadow-map-pin{border-radius:50% 50% 3px 50%}[dir=rtl] .shadow-stop>span{line-height:1.5}
@keyframes shadow-ice-breathe{50%{transform:translateY(-3px) rotate(3deg)}}@keyframes shadow-water{50%{transform:scaleY(.7);opacity:.6}}
@media(max-width:850px){.shadow-home{grid-template-columns:minmax(0,1fr);max-width:550px;margin:auto;padding-top:14px;gap:16px}.shadow-name,.shadow-next,.shadow-street,.shadow-street-note,.shadow-actions,.shadow-map,.shadow-secondary{grid-column:1}.shadow-name{grid-row:1}.shadow-next{grid-row:2;padding:20px}.shadow-street{grid-row:3;height:300px}.shadow-street-note{grid-row:4}.shadow-actions{grid-row:5}.shadow-map{grid-row:6;padding-inline:10px;margin-top:12px}.shadow-name h1{font-size:39px;margin:8px 0}.shadow-name>p{font-size:12px}.shadow-kicker{font-size:9px}.shadow-route-heading{margin-bottom:12px}.shadow-next h2{font-size:25px;margin-bottom:9px}.shadow-next>p{font-size:13px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.shadow-start{margin-top:15px;min-height:54px}.shadow-pocket{margin-top:16px;padding-top:12px}.shadow-route-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:390px){.shadow-home{padding-top:9px;gap:13px}.shadow-name h1{font-size:34px}.shadow-next{padding:16px}.shadow-next h2{font-size:22px}.shadow-next>p{font-size:12px}.shadow-route-heading{font-size:10px}.shadow-actions .quiet{font-size:10px}.shadow-route-grid{gap:6px}.shadow-stop>span{font-size:9px}.shadow-street{height:280px}.shadow-first-cover{left:23%}.shadow-ice{left:49%}.shadow-new-umbrella{left:0}}
@media(prefers-reduced-motion:reduce){.shadow-home *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}