:root{--background:#171717;--card:#1d1d1d;--card-hover:#191919;--border:#2a2a2a;--border-hover:#2e2e2e;--map-bg:var(--card);--map-land:var(--card);--map-land-ua:#2b2b2b;--map-border:#333333;--map-oblast-border:#3d3d3d;--map-label:#5a5a5a;--text-primary:#ededed;--text-secondary:#a1a1a1;--text-muted:#6b6b6b;--like-active:#ed1d24;--accent:#d4d4d4;--radius:20px;--radius-sm:14px;--gap:12px;--padding:20px;--transition:180ms ease;--like-duration:0.5s;--like-easing:cubic-bezier(0.7,0,0.3,1);--unit:min( calc((100vw - var(--padding) * 2 - var(--gap) * 5) / 6),calc((100vh - var(--padding) * 2 - var(--gap) * 2) / 3),calc(64vw / 6),calc(64vh / 3) );--max-width:1120px;color-scheme:dark}@supports (height:100dvh){:root{--unit:min( calc((100vw - var(--padding) * 2 - var(--gap) * 5) / 6),calc((100dvh - var(--padding) * 2 - var(--gap) * 2) / 3),calc(64vw / 6),calc(64dvh / 3) )}}[data-resolved-theme="light"]{--background:#f2f2f2;--card:#ffffff;--card-hover:#f7f7f7;--border:#e4e4e4;--border-hover:#d2d2d2;--text-primary:#161616;--text-secondary:#5c5c5c;--text-muted:#8d8d8d;--accent:#2a2a2a;--map-bg:var(--card);--map-land:var(--card);--map-land-ua:#fbfbfb;--map-border:#dedede;--map-oblast-border:#cfcfcf;--map-label:#949494;color-scheme:light}*,*::before,*::after{box-sizing:border-box}html,body{height:100%}body{margin:0;padding:var(--padding);background:var(--background);color:var(--text-primary);font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;display:flex;align-items:flex-start;justify-content:center;transition:background-color var(--transition),color var(--transition)}h1,p,ul{margin:0}ul{padding:0;list-style:none}.bento{width:calc(var(--unit) * 5+var(--gap) * 4);max-width:100%;display:grid;gap:var(--gap);grid-template-columns:repeat(5,var(--unit));grid-template-rows:repeat(3,var(--unit));grid-template-areas:"intro intro intro avatar clock" "discord steam telegram activity activity" "map map steam-stats likes theme"}.card--intro{grid-area:intro}.card--avatar{grid-area:avatar}.card--social[data-social="discord"]{grid-area:discord}.card--social[data-social="steam"]{grid-area:steam}.card--social[data-social="telegram"]{grid-area:telegram}.card--clock{grid-area:clock}.card--map{grid-area:map}.card--activity{grid-area:activity}.card--steam{grid-area:steam-stats}.card--likes{grid-area:likes}.card--theme{grid-area:theme}.card{position:relative;min-width:0;min-height:0;padding:clamp(14px,1.6vw,24px);background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 1px 2px rgba(0,0,0,0.25);overflow:hidden;transition:background-color var(--transition),border-color var(--transition),transform var(--transition)}.card--interactive:hover,a.card:hover,button.card:hover{background:var(--card-hover);border-color:var(--border-hover)}.icon{width:clamp(20px,1.7vw,26px);height:clamp(20px,1.7vw,26px);fill:currentColor;flex:none}.icon--lg{width:34px;height:34px}.card--intro{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:clamp(4px,calc(var(--unit) * 0.06),10px)}.intro__row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.intro__name{font-size:clamp(23px,calc(var(--unit) * 0.2),44px);font-weight:500;letter-spacing:-0.03em;line-height:1.1;overflow-wrap:anywhere}.intro__description{font-size:clamp(12px,calc(var(--unit) * 0.088),18px);color:var(--text-muted);overflow-wrap:anywhere}.card--avatar{padding:0;display:grid;place-items:center;aspect-ratio:1 / 1}.avatar__image{width:80%;height:80%;object-fit:scale-down}.card--social{display:grid;place-items:center;padding:0;color:var(--text-secondary);text-decoration:none}.card--social[data-social="discord"]{--brand:#5865f2}.card--social[data-social="steam"]{--brand:#ffffff}.card--social[data-social="telegram"]{--brand:#29b6f6}.card--social:hover,.card--social:focus-visible{color:var(--brand,var(--text-primary))}.card--disabled{cursor:default;opacity:0.45}.card--disabled:hover{background:var(--card);border-color:var(--border)}.social__icon{display:block;width:52px;height:52px;background-color:currentColor;opacity:0.85;transition:transform var(--transition),opacity var(--transition);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}.social__icon[data-icon="discord"]{-webkit-mask-image:url("../assets/icons/discord.svg");mask-image:url("../assets/icons/discord.svg")}.social__icon[data-icon="steam"]{-webkit-mask-image:url("../assets/icons/steam.svg");mask-image:url("../assets/icons/steam.svg")}.social__icon[data-icon="telegram"]{-webkit-mask-image:url("../assets/icons/telegram.svg");mask-image:url("../assets/icons/telegram.svg")}.card--social:hover .social__icon{transform:scale(1.06);opacity:1}.card--clock{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.clock__time{font-size:clamp(20px,2.2vw,30px);font-weight:500;letter-spacing:-0.02em;font-variant-numeric:tabular-nums}.clock__city{font-size:11px;font-weight:500;letter-spacing:0.18em;color:var(--text-muted);text-transform:uppercase}.card--map{padding:0;text-decoration:none;cursor:pointer}.map{position:relative;width:100%;height:100%;background:var(--map-bg);pointer-events:none}.map__label{position:absolute;left:12px;bottom:12px;z-index:500;padding:5px 10px;font-size:11px;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-secondary);background:var(--card);border:1px solid var(--border);border-radius:999px;pointer-events:none}.leaflet-container{background:var(--map-bg);font-family:inherit}.map__country{fill:var(--map-land);stroke:var(--map-border);stroke-width:1;stroke-linejoin:round;vector-effect:non-scaling-stroke;transition:fill var(--transition)}.map__country--ua{fill:var(--map-land-ua)}.map__oblast{fill:var(--map-land-ua);stroke:var(--map-oblast-border);stroke-width:0.5;stroke-linejoin:round;vector-effect:non-scaling-stroke;transition:fill var(--transition)}.leaflet-interactive{cursor:inherit}.leaflet-control-attribution,.leaflet-control-zoom{display:none}.leaflet-pane>svg path{pointer-events:none}.map--empty{background:var(--map-bg)}.map__marker{display:grid;place-items:center}.map__marker span{display:block;width:12px;height:12px;background:var(--text-primary);border:3px solid var(--card);border-radius:50%;box-shadow:0 0 0 1px var(--border);animation:map-pulse 2.2s ease-out infinite}.map__marker span::after{content:"";position:absolute;inset:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--text-primary);opacity:0;animation:map-halo 2.2s ease-out infinite}@keyframes map-pulse{0%,100%{box-shadow:0 0 0 1px var(--border),0 0 0 0 color-mix(in srgb,var(--text-primary) 45%,transparent)}50%{box-shadow:0 0 0 1px var(--border),0 0 0 7px color-mix(in srgb,var(--text-primary) 0%,transparent)}}@keyframes map-halo{0%{opacity:0.7;transform:scale(1)}70%,100%{opacity:0;transform:scale(2.6)}}@media (prefers-reduced-motion:reduce){.map__marker span,.map__marker span::after{animation:none}.map__marker span{box-shadow:0 0 0 1px var(--border),0 0 0 5px color-mix(in srgb,var(--text-primary) 12%,transparent)}}.card--activity{padding:0;display:flex;align-items:center;background:var(--card);color:var(--text-secondary)}.activity__cover{position:relative;flex:none;width:100px;height:100px;margin:18px}.activity__image{width:100%;height:100%;object-fit:cover;border-radius:14px;border:1px solid var(--border)}.activity__badge{position:absolute;right:-6px;bottom:-6px;width:26px;height:26px;object-fit:cover;border-radius:50%;border:2px solid var(--card);background:var(--card)}.activity__body{min-width:0;flex:1;display:flex;flex-direction:column;gap:5px;padding:18px 20px}.activity__kicker{font-size:clamp(11px,0.75vw,13px);font-weight:500;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-muted)}.activity__title{font-size:clamp(17px,1.6vw,24px);font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.activity__details{font-size:clamp(13px,1vw,16px);color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.activity__progress{height:3px;margin-top:5px;border-radius:999px;background:color-mix(in srgb,var(--text-primary) 12%,transparent);overflow:hidden}.activity__progress-bar{display:block;height:100%;width:0%;border-radius:999px;background:var(--text-secondary);transition:width 1s linear}.status{display:inline-flex;align-items:center;gap:7px;flex:none;padding:4px 10px;border:1px solid var(--border);border-radius:999px}.status__dot{width:7px;height:7px;border-radius:50%;background:var(--text-muted);transition:background-color var(--transition)}.status__dot[data-status="online"]{background:#4ade80}.status__dot[data-status="idle"]{background:#fbbf24}.status__dot[data-status="dnd"]{background:#ef4444}.status__label{font-size:11px;font-weight:500;color:var(--text-secondary)}.card--steam{display:flex;flex-direction:column;gap:10px;padding:16px 14px 14px;overflow:hidden}.steam__head{display:flex;align-items:center;gap:8px;flex:none}.steam__icon{flex:none;width:13px;height:13px;background:var(--text-muted);opacity:0.7;-webkit-mask-image:url("../assets/icons/steam.svg");mask-image:url("../assets/icons/steam.svg")}.steam__title{margin:0;font-size:11px;font-weight:500;letter-spacing:0.16em;text-transform:uppercase;color:var(--text-muted)}.steam__stats{display:flex;flex:1;flex-direction:column;margin:0;min-height:0}.steam__stat{flex:1;min-width:0;min-height:0;display:flex;align-items:center;justify-content:space-between;gap:6px;border-bottom:1px solid var(--border)}.steam__stat:last-child{border-bottom:0}.steam__value{order:2;margin:0;font-size:12.5px;font-weight:600;line-height:1.2;letter-spacing:-0.01em;color:var(--text-primary);font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.steam__label{order:1;flex:none;font-size:9px;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-muted)}.card--steam[data-steam-state="loading"] .steam__value{color:var(--text-muted);opacity:0.45}.card--steam[data-steam-state="unavailable"] .steam__stats{display:none}.steam__fallback{display:none;flex:1;margin:0;align-self:flex-start;font-size:11px;font-weight:450;line-height:1.4;color:var(--text-muted)}.card--steam[data-steam-state="unavailable"] .steam__fallback{display:flex;align-items:center}.card--likes{display:grid;place-items:center;padding:0}.likes__button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:100%;height:100%;padding:0;background:none;border:0;color:var(--text-secondary);font:inherit;cursor:pointer;transition:color var(--transition)}.likes__button:hover{color:var(--text-primary)}.icon--heart{transition:transform var(--transition)}.likes__button:hover .icon--heart{transform:scale(1.08)}.likes__button[aria-pressed="true"],.likes__button[aria-pressed="true"]:hover{color:var(--like-active)}.likes__button[aria-pressed="true"] .likes__count{color:var(--text-primary)}.likes__burst{position:relative;display:grid;place-items:center;font-size:clamp(32px,3vw,46px);line-height:1}.likes__burst>*{grid-area:1 / 1}.likes__heart-origin{transform-origin:center 80%}.likes__burst .icon--heart{z-index:2;width:clamp(28px,2.6vw,38px);height:clamp(28px,2.6vw,38px)}.likes__particles{width:1px;height:1px}.likes__particle{position:absolute;top:50%;left:50%;height:0.1em;width:0.1em;border-radius:50%;background-color:var(--color);--percentage:calc(var(--i) / var(--total-particles));--theta:calc(var(--percentage) * 1turn);transform:translate(-50%,-50%) rotate(var(--theta)) translateY(0) scaleY(0);transition:all var(--like-duration) var(--like-easing)}.likes__ripple{height:1em;width:1em;border-radius:50%;overflow:hidden;z-index:1}.likes__ripple::before{content:"";position:absolute;inset:0;border:0.12em solid currentColor;border-radius:inherit;transform:scale(0)}.likes__button.is-bursting .likes__ripple::before{animation:like-ripple-out var(--like-duration) var(--like-easing)}.likes__button.is-bursting .likes__particle{animation:like-particles-out calc(var(--like-duration) * 1.2) var(--like-easing) forwards}.likes__button.is-bursting .icon--heart{animation:like-heart-bounce var(--like-duration) var(--like-easing)}.likes__button:active .likes__burst{animation:like-depress var(--like-duration) var(--like-easing)}.likes__count{font-size:16px;font-weight:500;font-variant-numeric:tabular-nums}@keyframes like-heart-bounce{0%,80%,100%{transform:scale(1)}40%{transform:scale(0.7)}}@keyframes like-depress{from,to{transform:none}50%{transform:translateY(5%) scale(0.9)}}@keyframes like-ripple-out{from{transform:scale(0)}to{transform:scale(2.4)}}@keyframes like-particles-out{50%{height:0.3em}50%,60%{height:0.3em;transform:translate(-50%,-50%) rotate(var(--theta)) translateY(0.8em) scale(1)}60%{height:0.2em}100%{transform:translate(-50%,-50%) rotate(var(--theta)) translateY(1em) scale(0)}}.card--theme{display:grid;place-items:center;padding:0}.theme__button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:100%;height:100%;background:none;border:0;color:var(--text-secondary);font:inherit;cursor:pointer;transition:color var(--transition)}.theme__button:hover{color:var(--text-primary)}.theme__icon{width:28px;height:28px}.theme__icon--light{display:none}[data-resolved-theme="light"] .theme__icon--dark{display:none}[data-resolved-theme="light"] .theme__icon--light{display:block}.theme__label{font-size:13px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase}:focus-visible{outline:2px solid var(--text-primary);outline-offset:3px}@media (max-width:1100px){:root{--unit:min( calc((100vw - var(--padding) * 2 - var(--gap) * 3) / 4),calc((100dvh - var(--padding) * 2 - var(--gap) * 3) / 4) )}.bento{width:calc(var(--unit) * 4+var(--gap) * 3);grid-template-columns:repeat(4,var(--unit));grid-template-rows:repeat(4,var(--unit));grid-template-areas:"intro intro intro avatar" "discord steam telegram clock" "likes theme map map" "activity activity steam-stats steam-stats"}}@media (max-width:780px){:root{--gap:10px;--unit:min( calc((100vw - var(--padding) * 2 - var(--gap) * 3) / 4),calc((100dvh - var(--padding) * 2 - var(--gap) * 4) / 4) )}body{align-items:flex-start}.bento{width:calc(var(--unit) * 4+var(--gap) * 3);grid-template-columns:repeat(4,var(--unit));grid-template-rows:repeat(4,var(--unit));grid-template-areas:"intro intro intro avatar" "discord steam telegram clock" "likes theme map map" "activity activity steam-stats steam-stats"}}@media (max-width:520px){:root{--radius:16px;--padding:14px}.card{padding:14px}.bento{width:100%;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:auto;grid-template-areas:"intro intro" "avatar discord" "steam telegram" "map map" "activity activity" "clock likes" "theme steam-stats"}.card--avatar,.card--social,.card--clock,.card--likes,.card--theme{aspect-ratio:1 / 1}.card--intro,.card--activity{aspect-ratio:2 / 1}.card--map{aspect-ratio:3 / 2}}@media (min-width:781px) and (max-height:620px){body{align-items:flex-start}.bento{height:auto;min-height:560px}}::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}html[data-theme-transition="active"]::view-transition-group(root){animation-duration:var(--theme-transition-duration)}html[data-theme-transition="active"]::view-transition-new(root){clip-path:var(--theme-transition-clip-from)}.karablek-sparkles{position:relative;display:inline-block;max-width:100%}.intro__name .karablek-sparkles{display:inline;overflow-wrap:anywhere}.karablek-sparkle{position:absolute;top:0;left:0;width:21px;height:21px;pointer-events:none;z-index:2;animation:karablek-sparkle 1s ease-in-out infinite;animation-delay:var(--karablek-delay,0s);animation-fill-mode:both;opacity:0}@keyframes karablek-sparkle{0%{opacity:0;transform:scale(0) rotate(75deg)}50%{opacity:1;transform:scale(var(--karablek-scale,1)) rotate(120deg)}100%{opacity:0;transform:scale(0) rotate(150deg)}}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}.card--social:hover .icon,.likes__button:hover .icon--heart{transform:none}.karablek-sparkle{animation:none !important;opacity:0}.likes__button.is-bursting .likes__ripple::before,.likes__button.is-bursting .likes__particle,.likes__button.is-bursting .icon--heart,.likes__button:active .likes__burst{animation:none !important}.likes__particle{transform:translate(-50%,-50%) rotate(var(--theta)) translateY(0) scaleY(0)}}