/* MVP · Андрей Гусев — original prototype styles. */
@import url('https://fonts.googleapis.com/css2?family=Geologica:wght@400;500;600;700&display=swap');
:root{font-family:Geologica,Arial,sans-serif;color:#003b71;background:#f2f7fc;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #f58220;outline-offset:4px}button{color:inherit}a{color:inherit}header{height:104px;margin:0 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #003b7121}.brand{font-size:24px;font-weight:700;text-decoration:none;letter-spacing:-1px}.brand span{color:#0072bc}.brand small{display:block;font-size:10px;letter-spacing:1.6px;margin-top:7px;font-weight:500}.header-right{display:flex;align-items:center;gap:28px;font-size:12px;letter-spacing:1px}.round{border:1px solid #003b7140;border-radius:50%;width:40px;height:40px;background:transparent;font-size:18px}main{position:relative;min-height:650px;height:calc(100svh - 168px);max-height:1100px;overflow:hidden}.intro{position:absolute;left:48px;top:62px;width:340px;z-index:3;pointer-events:none}.intro button{pointer-events:auto}.eyebrow{font-size:11px;letter-spacing:1.7px;font-weight:500;display:flex;gap:12px;align-items:center}.line{height:1px;width:30px;background:#f58220}h1{font-size:clamp(54px,5.1vw,84px);font-weight:500;line-height:1.04;letter-spacing:-4px;margin:25px 0 24px}h1 em{font-style:normal;color:#0072bc}.lead{font-size:16px;line-height:1.7;color:#536f87}.anniversary{display:flex;align-items:center;gap:16px;margin:30px 0}.anniversary strong{font-size:68px;line-height:1;font-weight:400;letter-spacing:-5px}.anniversary div{font-size:14px;line-height:1.6;border-left:1px solid #003b7140;padding-left:16px}.anniversary small{display:block;font-size:11px;color:#536f87;margin-top:5px;letter-spacing:1px}.primary{display:flex;gap:22px;align-items:center;border:0;border-radius:3px;background:#003b71;color:white;padding:18px 21px;font-size:14px}.primary:hover{background:#005a9c}.primary span{font-size:22px}.hint{font-size:12px;color:#536f87;line-height:1.6;margin-top:15px}.intro-bottom{font-size:10px;letter-spacing:1.5px;margin-top:38px}.intro-bottom span{color:#f58220;margin-right:14px}#map{position:absolute;left:340px;right:0;top:0;bottom:0;overflow:hidden;background:radial-gradient(ellipse at 55% 55%,#dcecf900 35%,#f2f7fc 78%)}#canvas-wrap,#pins{position:absolute;inset:0}#canvas-wrap canvas{display:block;width:100%;height:100%;touch-action:none}#pins{pointer-events:none;overflow:hidden}.pin{position:absolute;border:0;background:none;width:40px;height:40px;padding:0;transform:translate(-50%,-50%);pointer-events:auto;display:grid;place-items:center}.pin-dot{display:grid;place-items:center;background:#f58220;color:white;border:2px solid #fff8;border-radius:50%;font:500 10px Geologica,Arial;width:23px;height:23px;box-shadow:0 3px 9px #003b7145;transition:transform .16s}.pin:hover .pin-dot,.pin[aria-pressed=true] .pin-dot{transform:scale(1.38);background:#003b71;border-color:white}.pin-label{position:absolute;left:32px;top:7px;color:#003b71;background:#ffffffe8;border-radius:3px;white-space:nowrap;padding:5px 8px;font-size:11px;box-shadow:0 2px 8px #003b710e;pointer-events:none}.pin:not(.landmark):not(:hover):not([aria-pressed=true]) .pin-label{display:none}.pin[aria-pressed=true]{z-index:5}.map-caption{position:absolute;top:36px;left:42%;font-size:10px;letter-spacing:3px;color:#718ca6;z-index:1}.map-label{position:absolute;bottom:18%;left:29%;font-size:10px;letter-spacing:3px;color:#527ca160;pointer-events:none}.map-label span{display:block;font-size:20px;letter-spacing:9px;margin-top:10px}.compass{position:absolute;right:55px;top:45px;text-align:center;font-size:12px}.compass div{font-size:34px;line-height:1.3}.map-controls{position:absolute;right:48px;bottom:89px;display:flex;flex-direction:column;box-shadow:0 6px 28px #003b7112;border:1px solid #003b7118;border-radius:6px;overflow:hidden}.map-controls button{width:46px;height:46px;border:0;background:#ffffffe8;font-size:24px}.map-controls button+button{border-top:1px solid #003b7114}.map-controls button:last-child{font-size:13px}.map-controls button:hover{background:#dbeaf8}.map-bottom{position:absolute;bottom:31px;left:8%;right:48px;display:flex;justify-content:space-between;font-size:11px;color:#536f87}.map-bottom i{width:7px;height:7px;background:#f58220;border-radius:50%;display:inline-block;margin-right:6px}#loading{position:absolute;left:35%;top:50%;font-size:15px;background:#f2f7fc;padding:18px}footer{height:64px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #003b7121;margin:0 48px;font-size:11px}footer b{color:#f58220;padding:0 10px}footer button{background:none;border:0;font-size:11px}footer .prototype{color:#607890}.detail{position:absolute;z-index:8;right:115px;top:24px;bottom:24px;width:330px;background:#ffffff;box-shadow:0 15px 75px #003b7126;border-radius:9px;overflow:auto}.close{border:0;background:#eef5fc;border-radius:50%;width:38px;height:38px;font-size:25px;display:grid;place-items:center}.detail>.close{position:absolute;right:12px;top:12px;z-index:2}.detail-body{padding:26px}.detail h2{font-size:25px;line-height:1.18;letter-spacing:-.8px;font-weight:500;margin:16px 0}.detail p{font-size:14px;line-height:1.6}.detail .place{color:#0072bc;font-weight:500}.detail dl{border-top:1px solid #003b7125;padding-top:18px;font-size:12px;line-height:1.6}.detail dt{color:#607890;margin-top:12px}.detail dd{margin:3px 0}.detail a{font-size:12px;text-underline-offset:4px}.detail-nav{display:flex;justify-content:space-between;align-items:center;margin-top:22px;font-size:12px}.detail-nav button{width:44px;height:44px;background:transparent;border:1px solid #003b7130;border-radius:50%;font-size:20px}#detail-photo:empty{height:22px;background:#0072bc}#detail-photo img{width:100%;height:175px;object-fit:cover;display:block}#detail-photo small{display:block;padding:8px 18px;font-size:10px;color:#536f87}dialog{border:0;border-radius:12px;background:#ffffff;color:#003b71;width:min(540px,calc(100% - 24px));max-height:85svh;padding:28px;box-shadow:0 20px 100px #102f3b30}dialog::backdrop{background:#003b7160;backdrop-filter:blur(5px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:22px}.dialog-head h2{margin:0;font-size:26px;font-weight:500}.dialog-head h2 span{font-size:14px;color:#f58220}dialog p,dialog li{font-size:14px;line-height:1.7}dialog li{margin:12px 0}.source-note{color:#607890}.search-label{font-size:12px;color:#536f87}input{display:block;width:100%;padding:14px;background:#f2f7fc;border:1px solid #003b7120;border-radius:5px;margin:8px 0 16px;font-size:16px}.branch-row{width:100%;display:flex;align-items:center;gap:16px;text-align:left;background:transparent;border:0;border-top:1px solid #003b7118;padding:16px 0}.branch-row:hover{background:#edf5fd}.branch-row b{font-size:12px;color:#d8640e}.branch-row strong{display:block;font-size:14px;font-weight:500}.branch-row small{display:block;font-size:12px;color:#607890;margin-top:5px}
@media(min-width:1600px){.intro{top:80px}#map{left:380px}.intro-bottom{margin-top:65px}}@media(max-width:1000px) and (min-width:701px){header,footer{margin-left:28px;margin-right:28px}.intro{left:28px;width:260px}h1{font-size:58px}#map{left:245px}.primary{font-size:12px;padding:16px 12px;gap:8px}.map-bottom>span:last-child{display:none}.detail{right:85px;width:300px}.map-controls{right:24px}}
@media(max-width:700px){header{height:78px;margin:0 20px}.brand{font-size:20px}.brand small{font-size:8px;letter-spacing:1px}.header-right{gap:12px}.header-right>span{display:none}main{height:auto;min-height:0;overflow:visible}.intro{position:relative;left:auto;top:auto;width:auto;margin:28px 20px 0;pointer-events:auto}.eyebrow{font-size:10px}h1{font-size:44px;letter-spacing:-2.5px;margin:16px 0 14px}h1 br{display:none}h1 em{margin-left:8px}.lead{font-size:14px;margin:0;line-height:1.5}.lead br{display:none}.anniversary{position:absolute;right:0;top:122px;gap:9px;margin:0}.anniversary strong{font-size:42px;letter-spacing:-2px}.anniversary div{font-size:10px;padding-left:9px}.anniversary small{display:none}.primary{margin-top:22px;font-size:12px;padding:12px 14px;gap:8px;height:46px}.hint,.intro-bottom{display:none}#map{position:relative;left:auto;right:auto;height:420px;margin-top:6px}.map-caption{top:18px;left:18%;font-size:8px;letter-spacing:2px}.compass{right:20px;top:20px;font-size:10px}.compass div{font-size:25px}.map-controls{right:16px;bottom:62px}.map-controls button{width:42px;height:44px}.map-bottom{left:20px;right:20px;bottom:16px;font-size:10px}.map-bottom>span:last-child{display:none}.map-label{left:23%;bottom:18%;font-size:8px;letter-spacing:2px}.map-label span{font-size:15px;letter-spacing:5px}.pin-label{font-size:10px;padding:4px 6px}.pin-dot{width:21px;height:21px;font-size:9px}footer{margin:0 20px;height:60px;font-size:10px}footer button{font-size:10px}.prototype{display:none}.detail{position:fixed;inset:auto 8px 8px;width:auto;max-height:66svh;border-radius:14px;z-index:20}.detail-body{padding:22px}.detail h2{font-size:24px;margin:12px 0}.detail dl{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}.detail dt{margin:0}.detail dd{margin:0}.detail-nav{margin-top:14px}#detail-photo img{height:140px}#loading{left:15%;top:45%}dialog{padding:23px}h1{white-space:nowrap}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}@media(max-width:360px){h1{font-size:43px}.anniversary{right:0;top:136px}.anniversary div{display:none}}
.pin:nth-child(9) .pin-label{left:auto;right:32px}

/* RusHydro blue and orange, concept v02 */
.brand,.brand span{color:#0072bc}.anniversary strong{color:#f58220}.pin-dot{box-shadow:0 3px 12px #003b7150}.map-label{opacity:.65}header{border-bottom-color:#0072bc25}footer{border-top-color:#0072bc25}.primary{background:#0072bc}.line{background:#f58220}

.terrain-credit{position:absolute;bottom:57px;right:48px;font-size:10px;color:#536f87;pointer-events:none}.prototype b{color:#0072bc;font-weight:700;padding:0}.prototype{white-space:nowrap}@media(max-width:700px){footer{height:auto;min-height:76px;display:grid;grid-template-columns:1fr auto;gap:12px;padding:16px 0}footer .prototype{display:block;grid-row:2;grid-column:1/-1;font-size:12px;color:#003b71}.terrain-credit{right:20px;bottom:39px;font-size:8px}.map-caption{font-size:8px}.map-label{display:none}}

/* MVP · Андрей Гусев — object photographs */
.photo-open{display:block;background:none;border:0;border-bottom:1px solid #0072bc40;color:#0072bc;padding:10px 0;font-size:12px;margin-top:8px}.photo-nav{display:flex;gap:8px;padding:0 18px 12px}.photo-nav button{width:36px;height:36px;border:1px solid #0072bc40;border-radius:50%;background:white;color:#0072bc}.photo-nav button[aria-pressed=true]{background:#0072bc;color:white}@media(max-width:700px){.photo-open{margin-top:10px}}

[hidden]{display:none!important}
