/* Light, tactile island-adventure interface. No blur or continuously animated UI. */
:root{--ui-forest:#315a48;--ui-edge:#264936;--ui-paper:#fff6dc;--ui-gold:#ebc477;--ui-gold-edge:#ac8242;--ui-shadow:#234b3933}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.island-weather{gap:5px;min-width:78px;min-height:44px;padding:5px 9px;border:2px solid var(--ui-forest);border-radius:13px;background:var(--ui-paper);box-shadow:0 3px 0 var(--ui-shadow),inset 0 0 0 1px #fffdf4;color:var(--ui-forest)}.island-weather>span:first-child{width:24px;height:27px}.island-weather svg{width:24px;height:27px}.island-weather>b{font-size:15px;line-height:1;letter-spacing:-.5px;font-variant-numeric:tabular-nums}.island-weather[data-state=stale]:after,.island-weather[data-state=unavailable]:after{content:'';position:absolute;right:4px;top:4px;width:5px;height:5px;background:#c29550;border-radius:50%}.island-weather[data-state=unavailable]{border-color:#829180;color:#829180}
.control-icon{display:block;width:20px;height:20px;pointer-events:none;flex-shrink:0}.mapcontrols{align-items:center;gap:9px}.mapcontrols button,.circlebtn,.navpair button,.stat{border:2px solid var(--ui-forest);background:var(--ui-paper);color:var(--ui-forest);box-shadow:0 3px 0 var(--ui-edge),inset 0 1px 0 #fffef2;border-radius:12px;transition:transform 80ms,box-shadow 80ms}.mapcontrols button,.navpair button{display:grid;place-items:center;min-width:44px;min-height:44px}.mapcontrols button{width:44px;height:44px}.navpair{gap:5px}.navpair button{width:44px;height:44px}.navpair .control-icon{width:17px;height:17px}.stat{min-height:44px;border-radius:14px;font-weight:700}.stat:active,.navpair button:active,.mapcontrols button:active{transform:translateY(2px);box-shadow:0 1px 0 var(--ui-edge)}
.mapfilters{gap:6px;padding-bottom:4px}.mapfilters button{border:1.5px solid #69876a;border-radius:10px;background:#fff7e6;color:#496c51;min-height:40px;font-weight:600;box-shadow:0 2px 0 #42684d44}.mapfilters button.active{color:#34583f;background:var(--ui-gold);border-color:#9c793d;box-shadow:0 2px 0 #92723b,inset 0 1px 0 #fff0c1}.mapfilters button:active{transform:translateY(1px)}
.dock{border:2px solid var(--ui-forest);border-radius:18px;background:var(--ui-paper);box-shadow:0 4px 0 #25483380,0 8px 22px #214b3524,inset 0 0 0 3px #fffdf0;padding:13px 15px}.dock h2{color:#31523e}.placecount{color:#8e794d;letter-spacing:1.3px}.dock .locationicon{border:2px solid #c0b788;border-radius:12px}.quickstory{color:#6a7f60!important}.detailsbtn{display:flex;align-items:center;justify-content:center;min-height:47px;padding:0 12px;font-weight:700;font-size:12px;color:#4e5433;background:linear-gradient(#f4d68d,#e7bd6e);border:1.5px solid #ad8544;border-radius:11px;box-shadow:0 3px 0 #96743d,inset 0 1px 0 #fff0c3}.playbtn{border:1.5px solid #1f4c36;border-radius:11px;background:linear-gradient(#3e7356,#2d5c44);color:#fff9df;box-shadow:0 3px 0 #1d402e,inset 0 1px 0 #69926c;gap:8px}.playbtn:active{transform:translateY(2px);box-shadow:0 1px 0 #1d402e}.savebtn{border:1.5px solid #ad9e6e;border-radius:11px;color:#6f8060;background:#f6edcf;box-shadow:0 3px 0 #a89b6a}.savebtn.saved{background:#e8c87d;color:#536342;border-color:#b5934e}.detailsbtn:active,.savebtn:active{transform:translateY(2px);box-shadow:0 1px 0 #9c8351}
.sheetback{background:#183d3c99;backdrop-filter:none}.sheet,.place-open .sheet{border:2px solid var(--ui-forest);border-radius:18px;background:var(--ui-paper);box-shadow:0 5px 0 #173b2d99,0 16px 45px #123a3540,inset 0 0 0 3px #fffced}.sheet:not(:has(.guidebook)){padding:34px 22px 23px}.sheet h2{color:#34553f;letter-spacing:-.5px;font-size:28px}.sheet>.kicker,#sheetContent>.kicker{display:inline-flex;align-items:center;gap:6px;max-width:calc(100% - 30px);padding:6px 10px;border:1px solid #bfa86b;border-radius:6px;background:#f0e2b7;color:#887343;font-size:8px;letter-spacing:1.5px}.sheetclose,.place-open .sheetclose{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;border:2px solid #476c50;background:#fff5d9;color:#4d6d4c;box-shadow:0 3px 0 #36533e;z-index:3}.sheetclose:active{transform:translateY(2px);box-shadow:0 1px 0 #36533e}.sheetclose .control-icon{width:17px;height:17px}.place-open .sheetclose{right:10px;top:10px;left:auto}.place-open .sheet .placebody{background:var(--ui-paper)}.guide-photo{border-bottom:3px solid #bea66a}.guide-heading .kicker{color:#9a7f43;font-weight:700}.guide-heading h2{font-size:26px;margin-top:5px}.guide-copy h3{color:#5a7550;font-size:14px}.guide-pagination{border-top:1px solid #d6cba4;padding-top:7px;gap:4px}.guide-pagination button{border:1px solid #d3c49b;border-radius:8px;background:#f7edce;box-shadow:0 2px 0 #c8b98c;color:#71805b;min-width:32px;font-weight:700}.guide-pagination button[aria-current=page]{background:#e8c474;color:#4d5c33;border-color:#ae8c49;box-shadow:0 2px 0 #9b7e44}.guide-pagination>button{min-width:44px;border-color:#9cb08a;background:#e9ebcf;color:#4e7250;box-shadow:0 2px 0 #8fa47e}.guide-pagination button:disabled{opacity:.36;box-shadow:none}.guide-pagination button:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px 0 #b09d68}.guide-actions{gap:8px}.guide-actions>button{width:50px;min-height:48px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1.5px solid #b8ac7c;background:#f7edcf;color:#6c8058;border-radius:10px;box-shadow:0 3px 0 #b6aa79;font-size:21px;line-height:1}.guide-actions>button small{font-size:8px;font-weight:600;line-height:1.2}.guide-actions>button[aria-pressed=true]{background:#dbe7bd;color:#466c3f;border-color:#95ac73;box-shadow:0 3px 0 #819768}.guide-actions .playbtn{min-height:48px}.secondary,.triplist li>button:not(.tripplace),.clusterlist button{border:1.5px solid #b5bd8e;background:#eeedcd;border-radius:10px;color:#60764f;box-shadow:0 2px 0 #a5b083}.secondary{min-height:46px}.secondary:active{transform:translateY(1px)}
.collection{gap:10px;margin:20px 0}.collection .medal{position:relative;padding:7px 4px 9px;border:1.5px dashed #b7bc91;border-radius:12px;background:#f1eccf;opacity:1;filter:none;min-height:92px;box-shadow:inset 0 0 0 2px #fff8df}.collection .medal.got{border:2px solid #8da865;background:#e7ecc5;box-shadow:0 3px 0 #879866,inset 0 0 0 2px #f9f5cf}.passport-art{display:block;width:66px;height:57px;margin:0 auto 4px}.passport-art .landmark-art{opacity:.72}.got .passport-art .landmark-art{opacity:1}.collection .medal small{font-size:10px;font-weight:600;color:#71805b;min-height:14px}.passport-check{position:absolute;top:5px;right:5px;width:18px;height:18px;display:grid;place-items:center;background:#6d8c54;color:#fff7d4;border-radius:50%;font-size:11px}.triplist{margin:18px 0}.triplist li{padding:10px 0;border-bottom:1px dashed #cbd1a7;gap:7px}.trip-number{display:grid;place-items:center;width:20px;height:24px;flex-shrink:0;font-size:10px;color:#9a8450;font-weight:700}.tripplace{gap:8px}.tripplace img{border:1px solid #acb68d;border-radius:8px}.triplist li>button:not(.tripplace){min-width:44px;height:44px}.triptools button{font-size:11px;padding:8px}.clusterlist button{min-height:64px;padding:9px}.clusterlist img{border:1px solid #a2b18a}.textbtn{min-height:44px}.infobtn{border:1.5px solid #78936c;background:#edf0d7;color:#647e56;min-width:36px;min-height:36px;box-shadow:0 2px 0 #6c8b6540}
@media(max-width:390px){.navpair button{width:38px;min-width:38px}.dock{padding:12px}.docktop{gap:8px}.dock h2{font-size:18px}.dock .locationicon{width:60px;height:60px}.guide-pagination button{min-width:27px;padding:0 3px}.guide-pagination>button{min-width:36px}.guide-heading h2{font-size:24px}.island-weather{left:14px}}
@media(max-height:500px){.sheet:not(:has(.guidebook)){padding:24px 20px 18px}.sheet h2{font-size:24px}.guide-heading h2{font-size:21px}.guide-pagination{padding-top:3px}.guide-actions>button,.guide-actions .playbtn{min-height:40px}.guide-actions>button{width:46px}.guide-actions>button span{font-size:17px}.guide-actions>button small{font-size:7px}.place-open .sheetclose{left:10px;right:auto}.dock{padding:10px 12px}.navpair button{width:38px;min-width:38px;height:44px}.mapcontrols{bottom:20px;right:16px;flex-direction:row;gap:6px}.island-weather{top:116px;min-height:44px}.collection .medal{min-height:80px}.passport-art{width:55px;height:47px}}
@media(prefers-reduced-motion:reduce){.mapcontrols button,.navpair button,.stat{transition:none}}
button.island-weather{font:inherit;text-align:left;cursor:pointer;transition:transform 80ms,box-shadow 80ms}button.island-weather:active{transform:translateY(2px);box-shadow:0 1px 0 var(--ui-shadow),inset 0 0 0 1px #fffdf4}button.island-weather:focus-visible{outline:3px solid #d8ab58;outline-offset:3px}
/* Local arrival details stay below place markers and sleep during interaction. */
#arrivals{pointer-events:none}.airport-landing{animation:airport-touchdown 26s ease-out infinite}.propeller-blade{transform-origin:0 0;animation:propeller-turn .16s linear infinite alternate}.harbour-docking{animation:harbour-approach 32s ease-out infinite}.map-busy #arrivals *,.reading #arrivals *{animation-play-state:paused!important}@keyframes airport-touchdown{0%{opacity:0;transform:translate(-110px,0) scale(1.12)}5%{opacity:1;transform:translate(-110px,0) scale(1.12)}58%{opacity:1;transform:translate(0,0) scale(1)}84%{opacity:1;transform:translate(12px,0) scale(1)}94%,100%{opacity:0;transform:translate(17px,0) scale(1)}}@keyframes propeller-turn{to{transform:scaleY(.2)}}@keyframes harbour-approach{0%,8%{opacity:0;transform:translate(-4px,9px)}15%{opacity:1}52%,92%{opacity:1;transform:translate(0,0)}100%{opacity:0;transform:translate(0,0)}}@media(prefers-reduced-motion:reduce){#arrivals *{animation:none!important;opacity:1}}
#arrivalMap{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;contain:strict;pointer-events:none}

.dockclose{display:grid;place-items:center;flex-shrink:0;align-self:flex-start;width:44px;height:44px;border:2px solid var(--ui-forest);border-radius:12px;background:var(--ui-paper);color:var(--ui-forest);box-shadow:0 3px 0 var(--ui-edge)}.dockclose .control-icon{width:17px;height:17px}.dockclose:active{transform:translateY(2px);box-shadow:0 1px 0 var(--ui-edge)}.place-panel-closed .mapcontrols,.place-panel-closed .infobtn{bottom:calc(24px + var(--safe))}

/* Plain-language experience labels reuse the existing header space. */
.guide-heading .place-experience{font-size:11px;line-height:1.35;color:#567361;margin:5px 0 0;font-weight:500}.dock #gameLabel{font-size:11px;line-height:1.35;font-weight:600;color:#486955}.dock .placecount{letter-spacing:.5px}

/* Keep every map symbol below the dock and modal, including selected pins. */
#map{z-index:0;isolation:isolate}
.reading #map{pointer-events:none}

.brand .game-brand-icon{display:block;width:36px;height:28px;object-fit:contain;flex-shrink:0}

/* Two-line wordmark balances the supplied landscape logo without crowding controls. */
.hud{gap:12px}.hud .brand{gap:10px;min-width:0;flex-shrink:1;font-size:28px;line-height:1.05}.brand .game-brand-icon{width:48px;height:36px}.brand-name{display:block;white-space:nowrap}.brand .brand-name small{font:700 9px/1.25 'DM Sans',sans-serif;letter-spacing:1.7px;margin-top:5px}.hud .stats{flex-shrink:0}
@media(min-width:850px){.hud .brand{font-size:30px;gap:12px}.brand .game-brand-icon{width:54px;height:40px}.brand .brand-name small{font-size:10px;letter-spacing:1.9px}}
@media(max-width:500px){.hud .brand{font-size:25px;gap:8px}.brand .game-brand-icon{width:40px;height:32px}.brand .brand-name small{font-size:8px;letter-spacing:1.3px;margin-top:4px}}
@media(max-width:360px){.hud{gap:8px}.hud .brand{font-size:23px;gap:6px}.brand .game-brand-icon{width:36px;height:30px}.brand .brand-name small{font-size:7.5px;letter-spacing:1.1px}}
