@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap');


*, *:before, *:after {box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}
html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:'Poppins', sans-serif;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}
h1{font-size:inherit;font-weight:inherit;}
a{color:inherit;text-decoration:inherit;}
h1,p{margin:0;}
input:focus, input:active, button:focus, button:active {outline: none;}
button{background-color:transparent;position: relative;overflow: hidden;border:none;color:inherit;cursor:pointer;}
::-webkit-scrollbar {width: 0;height: 0;background: transparent;}
img,svg,canvas{display:block;vertical-align:middle;}
img{max-width:100%;height:auto;}
img {user-drag: none;-webkit-user-drag: none;}
:root {
  --bg-color: #F2F5F8;
  --text-color: #5B5B5B;
  --border-color:rgb(203 213 225);
  --content-bg-color:rgb(255 255 255);
}
.dark {
  --bg-color: rgb(24 25 26);
  --text-color: rgb(194, 192, 192);
  --border-color:rgb(45 46 47);
  --content-bg-color:rgb(33 34 35);
}

body{margin:0;touch-action: manipulation;position:relative;line-height:inherit;background-color: var(--bg-color);font-size:1rem;color: var(--text-color);}
.root{display: flex;position: relative;min-height: 100vh;flex-direction: column;padding-top:2.5rem;padding-bottom:6.5rem;}
.card{width:100%;margin-left:auto;margin-right:auto;z-index:999;display: flex}
.card-content{padding:.75rem;overflow:hidden;flex: 1;clip-path:url(#card-corner);background-color:var(--content-bg-color);border-radius:1rem}
.card-corner{position:absolute;width:0;height:0}
.user-info{margin-left:1rem;margin-right:1rem;margin-top:1rem;text-align:center}
.user-avatar{width:9rem;height:9rem;margin-bottom:.625rem;display:block;margin-left:auto;margin-right:auto;border: 6px solid var(--border-color);overflow:hidden;border-radius:9999px}
.user-avatar img{height:100%;width:100%;border-radius:9999px}
.user-name{margin-bottom:.25rem;font-size: clamp(1rem, 2vw, 1.125rem); line-height:1.75rem;font-weight:600;color:inherit}
.user-desc{font-size:.875rem;line-height:1.25rem;display:inline-block;text-align:center;position:relative}
.line{margin-top:1rem;margin-bottom:1.5rem;border-top-width:1px;border-color:var(--border-color);}
.user-content{border-radius:1rem;display: flex;flex-direction: column;}
.user-content > div{padding-bottom: 1rem;overflow: hidden;}

.wave{position:absolute;background-color:rgba(255,255,255,.5);border-radius:50%;transform:scale(0);pointer-events:none;animation:wave-animation 0.9s ease-out}
@keyframes wave-animation { to {transform: scale(2);opacity: 0;} }
.scale {transition: transform 0.1s ease;will-change: transform;}
.scale:active {transform: scale(.95);}


.ymaps-2-1-79-map, .ymaps-2-1-79-inner-panes{border-radius: 10px !important;}
.maps:not(:last-of-type) {margin-bottom: 8px;}
[class*="copyrights-pane"] {display: none !important;}
.ymaps-2-1-79-zoom {top: 1rem  !important;}
.maps {
  touch-action: pan-x pan-y;
  align-items: center;
  justify-content: flex-start;
  display: flex;
  background: rgb(240 242 245 / 1);
  padding: 3px 3px;
  width: 100%;
  border-radius: 10px;
  text-align: center;
  text-decoration: none;
}
.dark .maps{background:rgb(45 46 47 / 1);}

footer{margin-top: auto;position: absolute;bottom: 0;width: 100%;margin-left:auto;margin-right:auto;}
.footer{padding-top:1.5rem;padding-bottom:2rem;text-align:center;}
.footer a{font-size: 14px;}

.lines{position:fixed;inset:0;z-index:-1;margin-left:auto;margin-right:auto;max-width: 45rem;}
.lines-wrapper{max-width:1130px;width:100%;height:100%;margin-left:auto;position:relative;display:flex;justify-content:space-between}
.lines-wrapper div{width:1px;height:100%;border-right-width:1px;border-style:dashed;border-color:var(--border-color);position:relative}
.lines-wrapper>*::before{content:'';position:absolute;background:linear-gradient(90deg,#1587cc,#2a33b2);transform:translate(0,0) rotate(45deg) skewX(0) skewY(0) scaleX(1) scaleY(1);width:.5rem;left:-.25rem;height:.5rem}
.lines-wrapper div:nth-child(odd)::before{animation:topBottom 25s linear infinite}
.lines-wrapper div:nth-child(even)::before{animation:bottomTop 25s linear infinite}
@keyframes bottomTop { 0% {content: '';bottom: -4rem;} 100% {content: '';bottom: 100%;} }
@keyframes topBottom { 0% {content: '';top: -4rem;} 100% {content: '';top: 100%;} }



.user-info__btn{display:flex;flex:1;}
.icon {fill: currentColor;width: 2rem;height: 2rem;flex-shrink: 0;}
.user-info__btn > * {min-height:42px;border-radius: 50px;min-width:42px;width:42px;align-items:center;display:flex;justify-content:center;}
.user-info__btn { gap: 0.5rem; }

.card-content svg{fill: currentColor;width:var(--icon-width, 2rem);}
.user-btn{user-select: none;cursor:pointer;align-items:center;border-radius:30px;display:flex;flex-direction:row;height:55px;padding:0 5px;transition:background-color .2s ease-out,scale .2s ease;width:100%;}
/*.user-btn::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 50%;background: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);border-radius: 5px 5px 0 0;}*/
.user-btn::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(to bottom, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 50%);}
.user-btn > :nth-child(2){width:1px;height:40px;background:currentColor;margin-right: 1rem;}
.user-btn__content{display:flex;flex:1;flex-direction:column;overflow:hidden;align-items: flex-start;}
.user-btn__icon{align-items:center;display:flex;flex-shrink:0;height:60%;justify-content:center;width:60px;}
.user-btn__text{font-size:12px;font-weight:600;}
.user-btn__value{font-size:12px;font-weight:300;padding-bottom: .2rem;}
.user-btn__text,.user-btn__value{width: 100%;max-width: 100%;text-align: left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}




@media (min-width: 1280px) {
  .lines { max-width: 60rem; }
}
@media (min-width: 1536px) {
  .lines { max-width: 71rem; }
}
@media not all and (min-width: 1280px){
  .root{padding-top:2rem;}
  .lines{max-width:45rem;}
}
@media not all and (min-width: 1024px){
  .main{padding-left:.5rem;padding-right:.5rem;}
}
@media (min-width: 768px){
  .card{max-width:28rem;}
}
@media not all and (min-width: 640px){
  .lines{padding-left:2rem;padding-right:2rem;}
}


.sr-only{position:absolute;inset-block-start:0;block-size:1px;inline-size:1px;padding:0;margin:-1px;overflow:hidden;border:0;clip:rect(0 0 0 0);}


/*----------------------------------------------------------------------
                        Toast
-----------------------------------------------------------------------*/
.toast-group {position: fixed;z-index: 9999;inset-block-end: 0;inset-inline: 0;-webkit-padding-after: 5vh;padding-block-end: 5vh;display: grid;justify-items: center;justify-content: center;gap: 1vh;pointer-events: none}
.toast {--_duration: var(--time-toast-out,3s);--_bg-lightness: 20%;--_travel-distance: 0;color: #fff;opacity:.9;font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;padding-block: .5ch;padding-inline: 1ch;border-radius: 8px;font-size: 15px;will-change: transform;-webkit-animation: fade-in .3s ease, slide-in .3s ease, fade-out .3s ease var(--_duration);animation: fade-in .3s ease, slide-in .3s ease, fade-out .3s ease var(--_duration)}
.toast-group .toast[data-type="error"] {background: #f44336;}
.toast-group .toast[data-type="success"] {background: #00B16A;}
.toast-group .toast[data-type="default"] {background: hsl(0 0% var(--_bg-lightness) / 90%);}
.toast-group .toast[data-type="info"] {background: #59ABE3;}
.toast-group .toast[data-type="warning"] {background: #F89406;}
.dark .toast {color: #000;--_bg-lightness: 90%}
@media (prefers-reduced-motion: no-preference) {  .toast {--_travel-distance: 5vh}  }
@-webkit-keyframes fade-in { 0% {opacity: 0} }
@keyframes fade-in { 0% {opacity: 0} }
@-webkit-keyframes fade-out { to {opacity: 0} }
@keyframes fade-out { to {opacity: 0} }
@-webkit-keyframes slide-in { 0% {transform: translateY(var(--_travel-distance, 10px))} }
@keyframes slide-in { 0% {transform: translateY(var(--_travel-distance, 10px))} }

/*----------------------------------------------------------------------
                        Modal
-----------------------------------------------------------------------*/
#qrcode {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0, 0, 0, 0.5);display: flex;justify-content: center;align-items: flex-start;opacity: 0;visibility: hidden;transition: all 0.3s ease;z-index: 999;}
#qrcode.active {opacity: 1;visibility: visible;}
.dark .modal-content{color:inherit;background-color:rgb(33 34 35 / 1);}
.modal-content {background-color: white;box-shadow: 0 4px 6px rgba(0, 0, 0, .1);z-index: 1001;max-height: 80vh;overflow-y: auto;padding: 1rem 0;width: 100%;}
.modal-content.center{border-radius: 8px;max-width: 450px;margin-top: 10rem;transform: translateY(-250px);transition: transform 0.3s ease;}
.modal-content.bottom {position: fixed;left: 0;right: 0;bottom: -100%;border-radius: 16px 16px 0 0;transition: bottom 0.3s ease;}
#qrcode.active .modal-content.bottom {bottom: 0;}
#qrcode.active .modal-content.center {transform: translateY(0);}
.modal-header{display:flex;justify-content:space-between;align-items:center;color:currentColor;padding:0 1rem}
.modal-header h3{margin:0;font-size: 17px;}
.modal-header .close{background:none;border:none;color:currentColor;font-size:24px;cursor:pointer;line-height:1}
.modal-body{display:flex;flex-direction:column;align-items:center;font-size:15px;font-weight: 400;overflow:hidden}
.modal-body img{width: 250px;}
.modal-body > p{font-size: 14px;}
.modal-body > div > svg{width: 1.5rem;fill: #1587cc;position: relative;bottom: 1px;}
.modal-body > div{background:#1587cc;-webkit-background-clip:text;-webkit-text-fill-color:transparent;cursor:pointer;padding-top:15px;display:flex}
@media (min-width: 768px){.modal-content.bottom {left: 50%;max-width: 450px;transform: translateX(-50%);}}
@media (prefers-reduced-motion:reduce){#qrcode,.modal-content{transition:none!important}.modal-content{transform:none!important}}






/* Улучшенный дизайн всплывающего окна Cookie */
#cookie-popup {
  position: fixed;
  bottom: -50%;
  right: 20px;
  background-color: var(--content-bg-color);
  padding: 15px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  border-radius: 30px;
  z-index: 1000;
  display: block;
  max-width: 400px;
  opacity: 0.5;
  transition: all 0.3s ease;
}

#cookie-popup.show {
  bottom: 20px;
  opacity: 1;
}

#cookie-popup p {
  margin: 0 0 15px 0; /* Больше отступ снизу */
  font-size: 14px; /* Чуть больше размер шрифта */
  color: var(--text-color);
  line-height: 1.4;
}

#cookie-popup a,a.link {
  color: inherit;
  font-weight: 500;
  text-decoration: underline;
  text-decoration-style: dashed;
  -webkit-text-decoration-style: dashed;
  text-underline-offset: 3px;
  -webkit-text-underline-offset: 3px;
}

#cookie-popup a:hover, a.link:hover {
  text-decoration: underline;
}

#cookie-popup button {
  background:linear-gradient(180deg,#1587cc,#2a33b2);
  border: none;
  color: white;
  user-select: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-decoration: none;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font-weight: 500;
  font-size: 15px; /* Размер шрифта кнопки */
  cursor: pointer;
  line-height: 1.2;
  border-radius: 50px; /* Закругление углов кнопки */
  padding: 8px 16px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); /* Тень для кнопки */
  -webkit-transition: color .3s, background-color .3s;
  transition: color .3s, background-color .3s;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

@media (max-width: 600px) {
  #cookie-popup {right: 10px;max-width: 95%;padding: 12px;}
  #cookie-popup p {margin-bottom: 10px;}
}