/* Fit the approved 1672 × 941 canvas as one composition.
   Never enlarge it or resize the horizontal and vertical axes independently. */
:root{
  --ref-x:min(1px,calc((100vw - 16px) / 1672),calc(100svh / 941));
  --ref-shortfall:0px;
  --ref-top:max(0px,calc((100svh - 941 * var(--ref-x)) / 2));
  --ref-left:calc((100% - 1672 * var(--ref-x)) / 2);
  --ref-gutter:calc(var(--ref-left) + 84 * var(--ref-x));
  --ref-line:#c7c8d2b0;
  --ref-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.04' numOctaves='3' seed='8'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
}
#hero,#about.about-studio,#contact.contact-cinematic,.about-work-scene>#about.about-studio{background:#050505!important}
#hero,#about.about-studio,#contact.contact-cinematic{height:100svh;min-height:0;padding:0;display:block;overflow:hidden}
#about.about-studio{border-top:0}
#contact.contact-cinematic{padding:0!important}
#contact.contact-cinematic>.contact-studio-background[aria-hidden]{display:none!important}
#hero h1>span:not(:nth-child(3)){
  background-image:var(--ref-grain),linear-gradient(150deg,#fff,#ededf1 48%,#fff 80%);
  background-blend-mode:soft-light;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
#about.about-studio .about-identity,#contact .contact-copy h2{background:none;color:#f2f2f0;-webkit-text-fill-color:currentColor}
#hero h1>span:nth-child(3),#about.about-studio .about-identity>span,#contact .contact-title-accent{
  background-image:var(--ref-grain),linear-gradient(155deg,#8584ff 3%,#6967ff 38%,#5653df 60%,#7f7bff 86%);
  background-blend-mode:soft-light;background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
}

/* Hero: the bottom edges of both windows share one baseline. */
#hero{
  --hero-window-top:max(calc(84 * var(--ref-x)),calc(103 * var(--ref-x) - .3 * var(--ref-shortfall)));
  --hero-reel-top:calc(626 * var(--ref-x) - .6 * var(--ref-shortfall));
  --hero-reel-height:calc(205 * var(--ref-x) - .19 * var(--ref-shortfall));
  --hero-window-height:calc(var(--hero-reel-top) + var(--hero-reel-height) - var(--hero-window-top));
  --hero-art-unit:min(var(--ref-x),calc(var(--hero-window-height) / 728));
}
#hero .hero-copy{position:absolute;inset:var(--ref-top) auto auto var(--ref-gutter);height:calc(941 * var(--ref-x));width:calc(704 * var(--ref-x));max-width:none;padding:0}
#hero .role{position:absolute;inset:calc(128 * var(--ref-x) - .4 * var(--ref-shortfall)) auto auto 0;height:auto;margin:0;font-size:calc(14 * var(--ref-x));line-height:1.85;letter-spacing:.1em}
#hero h1,html:lang(ru) #hero h1{position:absolute;top:calc(194 * var(--ref-x) - .4 * var(--ref-shortfall));width:100%;margin:0;font-size:calc(80 * var(--ref-x) - min(4 * var(--ref-x),.04 * var(--ref-shortfall)));line-height:1.02;font-weight:500;letter-spacing:0}
#hero h1>span,html:lang(ru) #hero h1>span,#hero h1>span:nth-child(3),html:lang(ru) #hero h1>span:nth-child(3){margin:0;font-size:1em;line-height:inherit;font-weight:500}
#hero .hero-description{position:absolute;top:calc(461 * var(--ref-x) - .5 * var(--ref-shortfall));margin:0;max-width:35ch;font:400 calc(21.5 * var(--ref-x))/calc(28 * var(--ref-x)) "Manrope",sans-serif;color:#c2c2cf}
#hero .hero-actions{position:absolute;top:calc(542 * var(--ref-x) - .6 * var(--ref-shortfall));margin:0;gap:calc(16 * var(--ref-x));width:max-content;max-width:100%;scale:none}
#hero .hero-action{min-height:calc(61 * var(--ref-x));padding:calc(17 * var(--ref-x)) calc(36 * var(--ref-x));gap:calc(22 * var(--ref-x));border-radius:999px;font-size:calc(18 * var(--ref-x));font-weight:500}
#hero .hero-action-primary{background:linear-gradient(125deg,#fcfcff,#ececf3);border-color:#eeeeF7}
#hero .hero-action-primary{min-width:calc(176 * var(--ref-x))}
#hero .hero-action:not(.hero-action-primary){min-width:calc(196 * var(--ref-x))}
#hero .hero-media{position:absolute;inset:auto;top:calc(var(--ref-top) + var(--hero-window-top));right:calc(var(--ref-left) + 80 * var(--ref-x));width:calc(716 * var(--ref-x));height:var(--hero-window-height);border:1px solid var(--ref-line);border-radius:calc(30 * var(--ref-x));overflow:hidden;z-index:1;background:radial-gradient(ellipse at 60% 30%,#111114,#050505 78%);box-shadow:inset 1px 0 2px #a99bff60}
#hero .hero-media::before,#hero .hero-media::after{content:none;display:none}
/* Clip the original portrait out of the approved artwork, including the full shirt.
   Its natural aspect stays intact even when the surrounding window is wider. */
#hero .hero-media img{position:absolute;inset:auto;left:calc(50% - 1234 * var(--hero-art-unit));top:calc(-103 * var(--hero-art-unit));width:calc(1672 * var(--hero-art-unit));height:calc(941 * var(--hero-art-unit));max-width:none;object-fit:fill;transform:none;filter:none;clip-path:inset(11.1583% 4.9043% 11.9022% 52.512% round calc(30 * var(--hero-art-unit)));mask-image:linear-gradient(90deg,transparent calc(878 * var(--hero-art-unit)),#000 calc(898 * var(--hero-art-unit) + 358 * (var(--ref-x) - var(--hero-art-unit))),#000 calc(1570 * var(--hero-art-unit) - 358 * (var(--ref-x) - var(--hero-art-unit))),transparent calc(1590 * var(--hero-art-unit)))}
#hero .showreel{position:absolute;inset:var(--hero-reel-top) auto auto 0;width:100%!important;height:var(--hero-reel-height);aspect-ratio:auto;max-width:none;margin:0;border:1px solid var(--ref-line);border-radius:calc(24 * var(--ref-x))!important;box-shadow:none}
#hero .hero-reel-art{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
#hero .hero-reel-art::after{content:none}
#hero .showreel img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;opacity:1;transform:none}
#hero .hero-reel-play{display:grid;width:calc(60 * var(--ref-x));height:calc(60 * var(--ref-x));background:#080b1266;backdrop-filter:blur(4px);border:1px solid var(--ref-line);box-shadow:none}
#hero .hero-reel-play svg{width:42%;height:42%;display:block}
#hero .hero-reel-meta{display:flex;left:calc(28 * var(--ref-x));right:auto;bottom:calc(20 * var(--ref-x));font-size:calc(14 * var(--ref-x));letter-spacing:.12em}
#hero .hero-footer{position:absolute;left:var(--ref-gutter);right:var(--ref-gutter);bottom:calc(var(--ref-top) + 24 * var(--ref-x));width:auto;padding-top:calc(20 * var(--ref-x));border-color:#ffffff40;font-size:calc(12 * var(--ref-x));line-height:1.5}

/* About: original type metrics; spare space above and below the grid adapts. */
#about{
  --about-top:calc(var(--ref-top) + 129 * var(--ref-x));
  --about-grid-height:calc(653 * var(--ref-x) - .25 * var(--ref-shortfall));
  --about-tool-gap:calc(40 * var(--ref-x) - .15 * var(--ref-shortfall));
}
#about .studio-layout{position:absolute;inset:var(--about-top) auto auto var(--ref-gutter);width:calc(1504 * var(--ref-x));min-height:0;height:var(--about-grid-height);grid-template-columns:minmax(0,.82fr) minmax(0,1fr);column-gap:calc(64 * var(--ref-x));row-gap:0;align-content:stretch}
#about .studio-biography{padding-top:calc(48 * var(--ref-x))}
#about.about-studio .about-identity{font-size:calc(72 * var(--ref-x));line-height:1.111111;margin:0 0 calc(48 * var(--ref-x))}
#about.about-studio .about-identity>span{display:inline-block;white-space:nowrap;transform:scaleX(.89);transform-origin:left center}
#about .studio-lead,#about .studio-notes{font:400 calc(21 * var(--ref-x))/1.6 "Manrope",sans-serif;max-width:none;color:#c4c4cd}
#about .studio-notes{margin-top:calc(25 * var(--ref-x))}
#about .studio-notes p+p{margin-top:calc(30 * var(--ref-x))}
#about .studio-highlight{font:inherit;letter-spacing:inherit;color:var(--accent)}
#about .studio-service-list{grid-template-rows:.82fr 1fr;gap:calc(20 * var(--ref-x) - min(4 * var(--ref-x),.04 * var(--ref-shortfall)))}
#about .studio-service{padding:calc(30 * var(--ref-x) - min(5 * var(--ref-x),.05 * var(--ref-shortfall)));border:1px solid var(--ref-line);border-radius:calc(22 * var(--ref-x));box-shadow:inset 1px 0 2px #a79cff90;background:#050509}
#about .studio-service:first-child{padding-bottom:calc(17 * var(--ref-x))}
#about .studio-service-copy,#about .studio-service:first-child .studio-service-copy{padding-top:0;max-width:100%}
#about .studio-service h3,#about .studio-service:first-child h3{font-size:calc(28 * var(--ref-x));line-height:1.35;margin-bottom:calc(10 * var(--ref-x))}
#about .studio-service:first-child h3{margin-bottom:calc(8 * var(--ref-x))}
#about .studio-service p{font-size:calc(18 * var(--ref-x));line-height:1.55}
/* Use the same independent images on desktop and mobile. */
#about .studio-service-image{display:block;object-fit:cover;opacity:1}
#about .studio-service::before{content:none;display:none}
#about .studio-service::after,#about .studio-service:first-child::after{background:linear-gradient(180deg,#07061000 20%,#07061020 48%,#070610b0 100%)}
#about .studio-service-copy{text-shadow:0 2px 10px #000b}
#about .studio-toolkit{position:absolute;top:calc(var(--about-grid-height) + var(--about-tool-gap));left:0;right:0;padding-top:calc(28 * var(--ref-x));border-top:1px solid #34343e}
#about .studio-toolkit::before{display:none}
#about .studio-tool-list{width:calc(1280 * var(--ref-x));max-width:100%;margin:0 auto;gap:calc(16 * var(--ref-x));justify-content:space-between}
#about .studio-tool-list li{font-size:calc(12 * var(--ref-x));gap:calc(12 * var(--ref-x));color:#d0cfdc}
#about .studio-tool-icon{width:calc(28 * var(--ref-x));height:calc(28 * var(--ref-x));flex-basis:calc(28 * var(--ref-x));filter:brightness(1.15)}

/* Contact: keep the live game; reduce panel padding before its playing field. */
#contact .contact-composition{position:static;display:block}
#contact .contact-copy{position:absolute;left:var(--ref-gutter);top:calc(var(--ref-top) + 211 * var(--ref-x));width:calc(480 * var(--ref-x))}
#contact .contact-availability{font-size:calc(12 * var(--ref-x));line-height:1.5;margin:0 0 calc(24 * var(--ref-x))}
#contact.contact-cinematic .contact-copy h2{font-size:calc(68 * var(--ref-x))!important;line-height:1.12;max-width:none}
#contact .contact-title-line{display:block;white-space:nowrap}
html:lang(ru) #contact .contact-title-line:first-child{transform:scaleX(.93);transform-origin:left center}
html:lang(en) #contact.contact-cinematic .contact-copy h2{font-size:calc(40 * var(--ref-x))!important}
#contact .contact-intro{margin-top:calc(22 * var(--ref-x));max-width:none;font-size:calc(20 * var(--ref-x));line-height:1.4;color:#c4c4cd}
#contact .contact-marks{margin:calc(39 * var(--ref-x)) 0 0 calc(-10 * var(--ref-x));gap:calc(22 * var(--ref-x))}
#contact .contact-channel{flex-basis:calc(68 * var(--ref-x))}
#contact .contact-mark{width:calc(68 * var(--ref-x));height:calc(68 * var(--ref-x))}
#contact .contact-mark svg{width:calc(36 * var(--ref-x));height:calc(36 * var(--ref-x))}
#contact .contact-mark--telegram svg{width:calc(32 * var(--ref-x));height:calc(32 * var(--ref-x))}
#contact .contact-behance-symbol{font-size:calc(29 * var(--ref-x))}
#contact .contact-copy-email{margin-top:calc(18 * var(--ref-x));padding:calc(18 * var(--ref-x)) calc(22 * var(--ref-x));min-height:calc(88 * var(--ref-x));min-width:calc(300 * var(--ref-x));border-radius:calc(30 * var(--ref-x));border-color:#9093b9;background:linear-gradient(120deg,#171824,#0a0a10)}
#contact .contact-copy-email-label{font-size:calc(12 * var(--ref-x))}
#contact .contact-email-address{font-size:calc(18 * var(--ref-x))}
#contact .contact-copy-feedback:empty{display:none}
#contact .contact-playground{position:absolute;top:calc(var(--ref-top) + 109 * var(--ref-x));left:calc(var(--ref-left) + 586 * var(--ref-x));width:calc(980 * var(--ref-x));padding:calc(46 * var(--ref-x) - .13 * var(--ref-shortfall)) calc(46 * var(--ref-x)) calc(36 * var(--ref-x) - .09 * var(--ref-shortfall));gap:calc(18 * var(--ref-x) - .035 * var(--ref-shortfall));border:1px solid var(--ref-line);border-radius:calc(30 * var(--ref-x));box-shadow:inset 1px 0 2px #aaa2ff90;background:radial-gradient(ellipse at 60% 28%,#14152155,transparent 65%),linear-gradient(145deg,#08090d,#050507 70%)}
#contact .contact-game-header{min-height:calc(60 * var(--ref-x))}
#contact .contact-game-header p{font-size:calc(14 * var(--ref-x));margin-bottom:calc(10 * var(--ref-x))}
#contact .contact-game-header h3{font-size:calc(31 * var(--ref-x));line-height:1}
#contact .contact-game-reset{width:calc(58 * var(--ref-x));height:calc(58 * var(--ref-x));flex-basis:calc(58 * var(--ref-x));color:#ededf3;border-color:#70768e;background:#07080a}
#contact .contact-game-reset svg{width:calc(22 * var(--ref-x));height:calc(22 * var(--ref-x))}
#contact .contact-playground .contact-runner{height:calc(458 * var(--ref-x) - .34 * var(--ref-shortfall))!important;border-radius:calc(24 * var(--ref-x))}
#contact .contact-playground .runner-hud{top:calc(24 * var(--ref-x));left:calc(28 * var(--ref-x));right:calc(28 * var(--ref-x));display:flex;justify-content:space-between}
#contact .contact-playground .runner-hud>div{gap:calc(7 * var(--ref-x))}
#contact .contact-playground .runner-hud>div:nth-child(2){transform:translateX(calc(8 * var(--ref-x)))}
#contact .contact-playground .runner-hud>div:nth-child(3){transform:translateX(calc(25 * var(--ref-x)))}
#contact .contact-playground .runner-hud span,#contact .runner-route{font-size:calc(14 * var(--ref-x))}
#contact .contact-playground .runner-hud b{font-size:calc(24 * var(--ref-x))}
#contact .runner-route{top:calc(90 * var(--ref-x));left:calc(28 * var(--ref-x))}
#contact .contact-playground .runner-message strong{font-size:calc(34 * var(--ref-x));line-height:1.16}
#contact .contact-playground .runner-message{top:53%;gap:calc(18 * var(--ref-x))}
#contact .contact-playground .runner-message-copy>span{font-size:calc(14 * var(--ref-x))}
#contact .contact-playground .runner-start{min-width:calc(200 * var(--ref-x));min-height:calc(60 * var(--ref-x));border-radius:999px;border-color:#858cae;background:linear-gradient(135deg,#101322,#07080d)}
#contact .contact-playground .runner-start .runner-start-label{font-size:calc(14 * var(--ref-x))}
#contact .contact-playground .runner-controls{right:calc(20 * var(--ref-x));bottom:calc(16 * var(--ref-x));gap:calc(14 * var(--ref-x))}
#contact .contact-playground .runner-controls button{height:calc(52 * var(--ref-x));min-width:calc(132 * var(--ref-x));font-size:calc(14 * var(--ref-x));background:#05060a;border-color:#5e6885}
#contact .runner-receivers{gap:calc(16 * var(--ref-x))}
#contact .runner-receivers li{height:calc(56 * var(--ref-x));border-radius:999px;color:#c8cce0;background:#05060a;border-color:#5b647d}
#contact .runner-receivers svg{width:calc(24 * var(--ref-x));height:calc(24 * var(--ref-x))}
#contact .runner-receivers li>span:not(.runner-receiver-status),#contact .runner-mission>p{font-size:calc(14 * var(--ref-x))}
#contact .contact-game-legend{display:none}
#contact .contact-game-instructions{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#contact.contact-cinematic .contact-bottom{position:absolute!important;inset:auto var(--ref-gutter) calc(var(--ref-top) + 24 * var(--ref-x));width:auto;margin:0;padding-top:calc(20 * var(--ref-x));font-size:calc(12 * var(--ref-x));line-height:1.5;border-color:#ffffff40}

@media(min-width:981px){
  /* Move the complete left composition without changing its internal spacing. */
  #hero{--hero-copy-shift:calc(var(--hero-window-top) - 132 * var(--ref-x) + .4 * var(--ref-shortfall))}
  #hero .hero-copy{top:calc(var(--ref-top) + var(--hero-copy-shift))}
  /* Extend only the reel to the portrait baseline; keep the text and buttons fixed. */
  #hero .showreel{height:calc(var(--hero-reel-height) - var(--hero-copy-shift))}
  /* Keep the heading and concise biography inside the service-card boundaries. */
  #about .studio-biography{padding-top:0}
  #about.about-studio .about-identity{margin-bottom:calc(32 * var(--ref-x))}
  .topbar.site-navigation{top:var(--ref-top);height:calc(84 * var(--ref-x));padding-inline:var(--ref-gutter)}
  .topbar.site-navigation .brand{font-size:calc(21 * var(--ref-x))}
  .site-navigation .brand sup{font-size:calc(9 * var(--ref-x))}
  .site-navigation .header-signature{gap:calc(34 * var(--ref-x))}
  .site-navigation .header-rule{width:calc(48 * var(--ref-x))}
  .topbar.site-navigation .nav{gap:calc(24 * var(--ref-x));font-size:calc(12 * var(--ref-x))}
  .topbar.site-navigation .nav>a{min-height:calc(31 * var(--ref-x));padding:calc(8 * var(--ref-x)) calc(13 * var(--ref-x))}
  .site-navigation .nav-separator{font-size:calc(14 * var(--ref-x))}
  .site-navigation .header-language{min-width:calc(68 * var(--ref-x));min-height:calc(31 * var(--ref-x));font-size:calc(12 * var(--ref-x));padding:calc(8 * var(--ref-x)) calc(13 * var(--ref-x))}
}

@media(max-width:980px){
  #hero,#about.about-studio,#contact.contact-cinematic{height:auto;min-height:100svh;padding:130px 6vw 36px!important;overflow:hidden}
  #hero{--hero-art-unit:calc((88vw - 2px) / 716);display:flex;flex-direction:column;gap:32px}
  #hero .hero-copy{position:relative;inset:auto;order:1;width:100%;height:auto}
  #hero .hero-copy>:is(.role,h1,.hero-description,.hero-actions,.showreel){position:relative;inset:auto}
  #hero .role{font-size:12px;line-height:1.75;margin-bottom:24px}
  #hero h1,html:lang(ru) #hero h1{font-size:clamp(26px,5.5vw,60px);line-height:1.1}
  #hero .hero-description{font-size:17px;line-height:1.6;margin-top:24px}
  #hero .hero-actions{margin-top:24px;gap:12px}
  #hero .hero-action{min-height:48px;padding:14px 24px;font-size:14px;gap:18px}
  #hero .showreel{height:auto;aspect-ratio:704/205;margin-top:24px;border-radius:20px!important}
  #hero .hero-reel-play{width:48px;height:48px}
  #hero .hero-reel-meta{left:20px;bottom:16px;font-size:12px}
  #hero .hero-media{position:relative;inset:auto;order:2;width:100%;height:auto;aspect-ratio:716/728;border-radius:24px}
  #hero .hero-media img{left:-122.346369%;top:-14.148352%;width:233.519553%;height:129.258242%;mask-image:none;clip-path:none}
  #hero .hero-footer{position:relative;inset:auto;order:3;width:100%;margin:0;font-size:11px;padding-top:18px}
  #about .studio-layout{position:relative;inset:auto;width:100%;height:auto;grid-template-columns:1fr;gap:34px}
  #about .studio-biography{padding:0;max-width:none}
  #about.about-studio .about-identity>span{display:inline-block;white-space:normal;transform:none}
  #about.about-studio .about-identity{font-size:clamp(28px,5.2vw,54px);margin-bottom:28px;line-height:1.16}
  #about .studio-lead,#about .studio-notes{font-size:17px;line-height:1.7}
  #about .studio-notes,#about .studio-notes p+p{margin-top:20px}
  #about .studio-service-list{gap:14px;grid-template-rows:auto auto}
  #about .studio-service::before{display:none}
  #about .studio-service::after{background:linear-gradient(180deg,#07061000 20%,#07061020 48%,#070610b0 100%)}
  #about .studio-service-image{display:block}
  #about .studio-service{min-height:250px;padding:24px;border-radius:24px}
  #about .studio-service:first-child{padding:24px}
  #about .studio-service:first-child h3{margin-bottom:10px}
  #about .studio-service h3,#about .studio-service:first-child h3{font-size:23px;margin-bottom:10px}
  #about .studio-service p{font-size:15px;line-height:1.65}
  #about .studio-toolkit{position:relative;inset:auto;padding-top:28px}
  #about .studio-tool-list{width:100%;justify-content:center;gap:24px 28px}
  #about .studio-tool-list li{font-size:11px;gap:10px}
  #about .studio-tool-icon{width:28px;height:28px;flex-basis:28px}
  #contact .contact-composition{display:grid;grid-template-columns:1fr;gap:40px;max-width:none}
  #contact .contact-copy,#contact .contact-playground{position:relative;inset:auto;width:100%}
  #contact .contact-availability{font-size:12px;margin-bottom:24px}
  #contact.contact-cinematic .contact-copy h2{font-size:clamp(35px,7.5vw,64px)!important}
  html:lang(en) #contact.contact-cinematic .contact-copy h2{font-size:clamp(30px,5.8vw,50px)!important}
  #contact .contact-intro{font-size:17px;line-height:1.6;margin-top:24px}
  #contact .contact-marks{margin:30px 0 0 -10px;gap:16px}
  #contact .contact-channel{flex-basis:56px}
  #contact .contact-mark{width:56px;height:56px}
  #contact .contact-mark svg{width:36px;height:36px}
  #contact .contact-mark--telegram svg{width:32px;height:32px}
  #contact .contact-behance-symbol{font-size:29px}
  #contact .contact-copy-email{min-width:0;min-height:72px;padding:16px 20px;margin-top:20px;border-radius:24px}
  #contact .contact-copy-email-label{font-size:12px}
  #contact .contact-email-address{font-size:16px}
  #contact .contact-playground{padding:20px;gap:16px;border-radius:24px}
  #contact .contact-game-header{min-height:50px}
  #contact .contact-game-header p{font-size:11px;margin-bottom:9px}
  #contact .contact-game-header h3{font-size:clamp(17px,3vw,25px)}
  #contact .contact-game-reset{width:34px;height:34px;flex-basis:34px}
  #contact .contact-game-reset svg{width:18px;height:18px}
  #contact .contact-playground .contact-runner{height:380px!important;border-radius:20px}
  #contact .contact-playground .runner-hud{top:18px;left:14px;right:14px}
  #contact .contact-playground .runner-hud span,#contact .runner-route{font-size:10px}
  #contact .contact-playground .runner-hud b{font-size:16px}
  #contact .contact-playground .runner-hud>div{transform:none!important}
  #contact .runner-route{top:74px;left:14px}
  #contact .contact-playground .runner-message strong{font-size:26px}
  #contact .contact-playground .runner-message{gap:14px}
  #contact .contact-playground .runner-message-copy>span{font-size:13px}
  #contact .contact-playground .runner-start{min-width:140px;min-height:46px}
  #contact .contact-playground .runner-start .runner-start-label{font-size:12px}
  #contact .contact-playground .runner-controls button{height:44px;min-width:96px;font-size:12px}
  #contact .contact-playground .runner-controls{right:12px;bottom:16px;gap:8px}
  #contact .runner-receivers{gap:8px}
  #contact .runner-receivers svg{width:20px;height:20px}
  #contact .runner-receivers li{height:48px}
  #contact .runner-receivers li>span:not(.runner-receiver-status),#contact .runner-mission>p{font-size:11px}
  #contact.contact-cinematic .contact-bottom{position:relative!important;inset:auto;margin-top:36px;padding-top:20px;font-size:11px}
}