@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
*{box-sizing:border-box}body{margin:0;background:#131521;color:#f7f3e9;font-family:'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #b5f46c;outline-offset:4px}header{max-width:1440px;margin:auto;padding:27px 5%;display:flex;align-items:center;gap:30px;border-bottom:1px solid #ffffff15}#brand{font-family:'Space Grotesk',sans-serif;color:#fff;font-size:26px;font-weight:700;letter-spacing:-1.4px;text-decoration:none}#brand span{display:block;font:10px 'DM Sans',sans-serif;letter-spacing:2.5px;color:#999daa;margin-top:4px}nav{display:flex;gap:6px;margin:auto}.tab,#sound,.toolbar button{border:0;background:transparent;color:#a8abba;padding:12px 16px;border-radius:7px;font-size:14px}.tab.active{background:#292c3a;color:#fff}#sound{border:1px solid #444653}main{max-width:1240px;margin:0 auto;padding:36px 35px}.heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:26px}#eyebrow{font-size:11px;letter-spacing:2px;color:#b5f46c;font-weight:700;margin:0 0 12px}h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(29px,4vw,49px);letter-spacing:-2.1px;line-height:1.1;margin:0}h1 span{color:#b5f46c}#intro{font-size:14px;line-height:1.7;color:#a8abba;margin:0}.machine{border:1px solid #444550;border-radius:14px;overflow:hidden;background:#1c1f2c;box-shadow:0 24px 80px #0003}.toolbar{display:flex;justify-content:space-between;align-items:center;padding:9px 22px;font-size:12px;letter-spacing:1.5px}.toolbar>div{display:flex;align-items:center;gap:12px}.toolbar button{padding:9px;letter-spacing:0}.stage{position:relative;aspect-ratio:5/3;overflow:hidden}canvas{width:100%;height:100%;display:block;touch-action:none}#overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;background:#1114259c;backdrop-filter:blur(3px);padding:20px;z-index:3}#overlay.hidden{display:none}#tag{font-size:11px;letter-spacing:2px;color:#b5f46c}h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(25px,4vw,46px);letter-spacing:-1.6px;margin:12px 0}#instructions{font-size:15px;line-height:1.8;color:#d9dbe4}#play{border:0;background:#b5f46c;border-radius:8px;font-weight:700;padding:16px 26px;margin-top:12px;color:#1b2613;min-width:180px}#play span{margin-left:25px}.hud{position:absolute;top:20px;left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}#score{font:700 28px 'Space Grotesk',sans-serif;text-shadow:0 2px 10px #0009}#message{font-size:12px;letter-spacing:1px;background:#111625c9;padding:9px 12px;border-radius:5px}.controls{display:flex;justify-content:center;gap:12px;padding:13px;border-top:1px solid #ffffff14}.controls button{border:1px solid #505461;border-bottom:3px solid #505461;background:#2b2e3c;color:#eee;border-radius:7px;padding:9px 22px;font-size:13px;touch-action:none;user-select:none}.controls button:active,.controls button.held{background:#b5f46c;color:#182111;border-color:#b5f46c}footer{display:flex;justify-content:space-between;gap:20px;color:#989baa;font-size:12px;margin-top:20px}footer span:last-child{color:#727788}@media(max-width:700px){header{padding:18px;gap:15px;flex-wrap:wrap}#brand{font-size:23px}nav{order:3;width:100%;justify-content:center}.tab{flex:1;padding:10px 4px;font-size:12px}#sound{margin-left:auto;font-size:12px}main{padding:25px 12px}.heading{display:block}#intro{margin-top:14px;font-size:13px}h1{letter-spacing:-1.3px}.stage{aspect-ratio:4/5}canvas{object-fit:fill}.toolbar{padding:5px 12px;font-size:10px;letter-spacing:.6px}.toolbar>div{gap:3px}.toolbar button{font-size:12px}.controls{gap:7px;flex-wrap:wrap}.controls button{padding:12px 14px}footer{line-height:1.6}footer span:last-child{display:none}#instructions{font-size:13px}.hud{left:14px;right:14px;top:14px}#message{font-size:10px}#score{font-size:23px}}
[hidden]{display:none!important}.pickerHeading{display:flex;align-items:end;justify-content:space-between;margin:30px 0 22px}.pickerHeading h2{font-size:29px;margin:8px 0}.miniLabel{font-size:12px;letter-spacing:2px;color:#b5f46c}.pickerHeading>span{color:#9399aa;font-size:12px;letter-spacing:1px}#landmarkGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.landmarkCard{padding:0;border:1px solid #3a4050;border-radius:13px;overflow:hidden;background:#202534;color:#f7f3e9;text-align:left;transition:transform .2s,border-color .2s}.landmarkCard:hover{transform:translateY(-5px);border-color:#b5f46c}.landmarkPhoto{height:270px;position:relative;overflow:hidden;background:#344557}.landmarkPhoto:after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#141925a8)}.landmarkPhoto img{width:100%;height:100%;object-fit:cover;object-position:center 35%;transition:transform .4s}.landmarkCard:hover img{transform:scale(1.04)}.difficulty{position:absolute;left:15px;top:15px;padding:7px 12px;background:#111a2ace;color:#dbf8b9;border-radius:20px;font-size:12px}.cardNumber{position:absolute;bottom:14px;left:18px;font:600 40px 'Space Grotesk',sans-serif;z-index:1}.landmarkText{padding:21px}.landmarkText>p:first-child{color:#b5f46c;font-size:13px;margin:0 0 9px}.landmarkText h3{font:600 23px 'Space Grotesk',sans-serif;letter-spacing:-.7px;margin:0}.routeDescription{color:#abb1c1;font-size:14px;line-height:1.6;min-height:46px}.cardBottom{border-top:1px solid #ffffff15;padding-top:17px;display:flex;justify-content:space-between;align-items:center;font-size:12px;gap:8px}.cardBottom span{color:#969fb0}.cardBottom strong{font-size:14px}.pickerFoot{display:flex;justify-content:space-between;gap:20px;color:#a9afbe;font-size:13px;padding:23px 0}.pickerFoot span:last-child{color:#7f879a}.credits{font-size:12px;line-height:1.7;color:#8f98ab}.credits summary{cursor:pointer}.credits a{color:#bcc7db}#changeBuilding{color:#b5f46c}.toolbar #level{margin-right:auto}.toolbar{gap:12px}#pickerStatus{color:#ffb29f;font-size:14px}@media(max-width:700px){#landmarkGrid{grid-template-columns:1fr}.landmarkCard{display:grid;grid-template-columns:35% 65%}.landmarkPhoto{height:100%;min-height:235px}.landmarkText{padding:17px}.landmarkText h3{font-size:22px}.pickerHeading>span{display:none}.pickerFoot{display:block;line-height:1.8}.pickerFoot span{display:block}.toolbar{flex-wrap:wrap;gap:2px}.toolbar #level{font-size:10px}.routeDescription{min-height:0}}

@media(max-width:700px){.stage{aspect-ratio:5/3}#overlay{padding:10px}#overlay h2{font-size:22px;margin:3px 0}#tag{margin:3px 0;font-size:10px}#instructions{font-size:11px;line-height:1.4;margin:6px 0}#play{padding:10px 18px;margin-top:4px}.hud{top:8px;left:10px;right:10px}#score{font-size:18px}#message{max-width:65%;font-size:9px;padding:5px}.controls button{font-size:12px;padding:12px}}

/* Suppress iOS text selection and the long-press callout on game input only. */
#touch,#touch *,canvas{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:none}
#touch button{-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;min-width:48px;min-height:48px}
#timer{font:600 22px 'Space Grotesk',sans-serif;background:#132237ec;padding:8px 14px;border:1px solid #afc38a;border-radius:8px;margin-left:14px;margin-right:auto;color:#d2efae}#timer.urgent{color:#ffab8b;border-color:#ffab8b}#summit{background:#172334}.summitPhoto{position:relative;height:380px;overflow:hidden}.summitPhoto img{width:100%;height:100%;object-fit:cover;transform:scale(1.18);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:grab;animation:viewReveal 1.2s ease-out}.summitPhoto img:active{cursor:grabbing}.summitBadge{position:absolute;left:24px;top:24px;color:#dbffc1;background:#172d28df;border:1px solid #9bc977;border-radius:30px;padding:10px 16px;font-size:12px;letter-spacing:1.7px}.summitContent{padding:22px 28px 28px}.summitContent h2{margin:0 0 10px}.summitContent p{color:#b7c7d3;font-size:14px}.summitContent label{display:block;font-size:14px;margin-top:22px}.summitContent label span{color:#99aabb;margin-left:12px;font-size:12px}#panView{width:100%;accent-color:#b5f46c;margin:16px 0;cursor:ew-resize}.summitActions{display:flex;gap:12px;flex-wrap:wrap}.summitActions button,#viewRetry{padding:13px 20px;border:1px solid #526577;border-radius:8px;background:#223449;color:#e7f0f3;font:600 14px 'DM Sans',sans-serif}.summitActions button:first-child{background:#b5f46c;border-color:#b5f46c;color:#1d3118}.machine:has(#summit:not([hidden])) .stage,.machine:has(#summit:not([hidden])) #touch,.machine:has(#summit:not([hidden])) #viewMode{display:none}.stage:has(#overlay:not(.hidden)) .hud{visibility:hidden}@keyframes viewReveal{from{opacity:0;transform:scale(1.3)}to{opacity:1;transform:scale(1.18)}}@media(prefers-reduced-motion:reduce){.summitPhoto img{animation:none}}@media(max-width:700px){#timer{font-size:14px;padding:4px 8px;margin-left:8px}#message{max-width:52%;font-size:9px}.summitPhoto{height:260px}.summitContent{padding:20px}.summitContent label span{display:block;margin:5px 0}.toolbar>div{flex-wrap:wrap}.summitBadge{left:14px;top:14px;font-size:10px}}
.viewTools{display:flex;gap:8px;flex-wrap:wrap;padding:12px 18px;background:#152233}.viewTools button{padding:10px 15px;border:1px solid #516172;color:#e5eef5;background:#213448;border-radius:7px;font:500 13px 'DM Sans',sans-serif}.viewTools button[aria-pressed=true]{background:#b5f46c;color:#182818;border-color:#b5f46c}.viewTools button:last-child{margin-left:auto}.summitPhoto{height:clamp(360px,65svh,800px);background:#09121e}.panoramaFull .summitPhoto img{object-fit:contain;animation:none;transform:none}.immersive{position:fixed;inset:0;z-index:50;overflow-y:auto;padding-top:env(safe-area-inset-top)}.immersive .viewTools{position:sticky;top:0;z-index:2}.immersive .summitPhoto{height:75svh}@media(max-width:700px){.viewTools{padding:10px;gap:6px}.viewTools button{font-size:12px;padding:10px}.viewTools button:last-child{margin-left:0}.summitPhoto{height:55svh;min-height:260px}.immersive .summitPhoto{height:65svh}}
.summitLook{display:flex;gap:12px;margin:18px 0}.summitLook button{flex:1;padding:15px;border:1px solid #718292;border-radius:8px;background:#23394c;color:#eef6fa;font:600 14px 'DM Sans',sans-serif;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.summitLook button:active{background:#b5f46c;color:#172b15}.summitContent label span{line-height:1.6}
.soundSetup{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin:9px 0}.soundSetup button{background:#253a49;border:1px solid #749581;border-radius:7px;padding:9px 14px;color:#ddf8c6;font:600 13px 'DM Sans',sans-serif}.soundSetup span{flex-basis:100%;font-size:12px;color:#c3d0db}#viewChoices{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}#viewChoices button{padding:10px 14px;background:#263c51;color:#e6f1f7;border:1px solid #63788b;border-radius:7px;font-size:13px}#viewChoices button[aria-pressed=true]{background:#b5f46c;color:#142414}#viewCounter{font-size:13px;color:#b5f46c}.summitPhoto img{animation:none;transition:opacity .18s ease} @media(max-width:700px){.soundSetup{gap:5px;margin:3px 0}.soundSetup button{padding:6px 10px;font-size:11px}.soundSetup span{font-size:10px}#overlay #instructions{margin:3px 0;font-size:10px}.stage:has(#overlay:not(.hidden)){min-height:325px}}
#viewChoices button{padding:0;overflow:hidden;flex:1;min-width:90px;display:flex;flex-direction:column;align-items:stretch}#viewChoices img{width:100%;height:85px;object-fit:cover}#viewChoices span{padding:9px 8px}.summitPhoto img{object-position:center}
#summitPrevious{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;z-index:1}#summitImage{position:relative;z-index:2}.summitBadge{z-index:3}

.landmarkItem{min-width:0;display:flex;flex-direction:column}.landmarkItem .landmarkCard{width:100%;flex:1}.endingPreview{color:#dfff82;font-size:14px;padding:14px 4px;text-decoration:none}.endingPreview:hover{text-decoration:underline}#deferredList{line-height:1.7}#deferredList li{margin:8px 0}
.birdPreview{font-size:13px;padding:7px 10px;align-self:flex-start;margin-bottom:16px;color:#cad5de;background:#222a35;border:1px solid #45505b;border-radius:6px;cursor:pointer}

#avatarPicker{padding:24px 0 36px}#avatarPicker h2{font-size:clamp(28px,4vw,44px);margin:8px 0}#avatarPicker>p{color:#bfc9d8}#avatarGrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin:26px 0}.avatarCard{color:#edf2f9;background:#212a39;border:2px solid #3d495b;border-radius:18px;padding:12px 6px 18px;cursor:pointer}.avatarCard[aria-pressed=true]{border-color:#dfff82;background:#303e39;box-shadow:0 0 0 2px #dfff8230}.avatarCard canvas{display:block;width:100%;height:auto;max-width:180px;margin:auto}.avatarCard strong{font-size:18px}#avatarContinue{background:#dfff82;color:#15222a;border:0;border-radius:100px;padding:16px 26px;font:600 17px inherit;cursor:pointer}#changeAvatar{background:#252f40;color:#dfff82;border:1px solid #536075;border-radius:20px;padding:8px 14px;cursor:pointer}@media(max-width:850px){#avatarGrid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:480px){#avatarGrid{gap:9px}.avatarCard{padding:5px 2px 12px}.avatarCard strong{font-size:16px}}

#avatarGrid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:860px}.avatarIdentity{display:block;color:#c5cfdb;font-size:14px;margin-top:6px}.avatarCard canvas{max-width:145px}.avatarCard{padding:8px 6px 14px}

.machine{scroll-margin-top:12px}@media(min-width:701px){.machine{max-width:min(100%,calc(166.667svh - 266.667px));margin-inline:auto}.toolbar{flex-wrap:wrap;gap:4px}.toolbar>div{flex-wrap:wrap}}

/* Once a climb is chosen on a phone, the game becomes the page. */
@media(max-width:700px){
 body:has(#gamePanel:not([hidden]))>header,
 body:has(#gamePanel:not([hidden])) main>.heading,
 body:has(#gamePanel:not([hidden])) main>footer{display:none}
 body:has(#gamePanel:not([hidden])) main{max-width:none;height:100dvh;padding:0}
 body:has(#gamePanel:not([hidden])) .machine{height:100%;display:flex;flex-direction:column;border:0;border-radius:0;box-shadow:none}
 body:has(#gamePanel:not([hidden])) .toolbar,
 body:has(#gamePanel:not([hidden])) .controls{flex:0 0 auto}
 body:has(#gamePanel:not([hidden])) .stage{flex:1 1 auto;min-height:0;height:auto;aspect-ratio:auto}
 body:has(#gamePanel:not([hidden])) canvas{width:100%;height:100%;object-fit:fill}
}
