@font-face{font-family:Arena;src:url('./assets/arena-condensed.woff') format('woff');font-display:swap;font-weight:700}
:root{color-scheme:dark;font-family:Arial,sans-serif;background:#02070d;color:#f3f8ff}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#02070d}body{min-height:100svh;display:grid;place-items:center}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:3px solid #fff;outline-offset:4px}button:disabled{cursor:wait}button:hover{filter:brightness(1.17)}[hidden]{display:none!important}svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}button,svg{touch-action:manipulation}button{ -webkit-tap-highlight-color:transparent }
.arena{position:relative;width:min(100vw,177.6833svh);aspect-ratio:1672/941;container-type:inline-size;overflow:hidden;background:#01050a}.opening,.menu{position:absolute;inset:0}.opening{z-index:2;background:#010604}.opening-art{position:absolute;inset:0;background:url('./assets/opening.webp') center/100% 100% no-repeat}.opening-glow{position:absolute;inset:45% 18% 10% 26%;background:radial-gradient(ellipse at 50% 85%,#45ff191c,transparent 65%);animation:glow 4s ease-in-out infinite;pointer-events:none}.opening-credit{position:absolute;left:36.7%;top:37.4%;width:29%;height:3.4%;display:grid;place-items:center;background:linear-gradient(90deg,#051015d9,#071017f2,#051015d9);text-transform:uppercase;font-size:.85cqw;letter-spacing:.43cqw}.opening-controls{position:absolute;left:32%;right:29%;top:88.6%;text-align:center;background:linear-gradient(90deg,transparent,#020c07f5 15%,#020c07f5 85%,transparent);padding:.35cqw 0 .5cqw}.enter-arena{border:0;background:transparent;display:block;width:100%;padding:.4cqw;color:#efffed;font-size:1.1cqw;letter-spacing:.53cqw;animation:press 2.4s ease-in-out infinite;text-shadow:0 0 14px #6fff44}.opening-controls p{font-size:.64cqw;margin:.3cqw 0;color:#b3d8ba}.opening-controls progress{display:block;width:60%;height:2px;border:0;margin:.5cqw auto 0;accent-color:#5dff24}.opening-controls progress::-webkit-progress-bar{background:#17371a}.opening-controls progress::-webkit-progress-value{background:#6aff31;box-shadow:0 0 10px #46ff00}.retry{background:#10290d;border:1px solid #6aff31;padding:8px 14px;margin:8px}.menu{background:#02070d}.menu-scene{position:absolute;inset:0;background:url('./assets/menu-scene.webp') center/100% 100%;pointer-events:none}.brand{position:absolute;left:1.7%;top:.3%;width:29%;height:21%;background:url('./assets/reference.webp') 2.4% .5% /344.83% 476.19%;pointer-events:none}.developer{position:absolute;left:2.5%;top:22.7%;display:flex;align-items:center;gap:1.5cqw;font-size:1.5cqw;text-shadow:0 2px 10px #000}.developer small{display:block;font-size:1.05cqw;color:#9fc6dd;margin-bottom:.1cqw}.developer strong{font-style:italic;font-weight:800}.signature{font-family:cursive;font-style:italic;font-size:3.2cqw;transform:rotate(-15deg);text-shadow:0 -7px 0 #19b9ff}
.frame{border:1px solid #33bfff;border-radius:.5cqw;background:linear-gradient(120deg,#041321ed,#00060de8);box-shadow:inset 0 0 1cqw #005e8d29}.topbar{position:absolute;left:44.4%;right:1.2%;top:1.25%;height:6.9%;display:grid;grid-template-columns:3.9fr 1.85fr 1.85fr .8fr .8fr .8fr .8fr;gap:.45cqw}.profile{display:flex;align-items:center;padding:.15cqw .75cqw .15cqw .3cqw;gap:.85cqw;min-width:0}.avatar{height:100%;aspect-ratio:1;border:1px solid #64b5df;border-radius:.5cqw;color:#85a9c5;background:linear-gradient(130deg,#112b42,#061221);overflow:hidden;flex-shrink:0}.avatar img{width:100%;height:100%;object-fit:cover}.nick{font-size:1.03cqw;text-align:left;border:1px solid #28516a;background:#071521bf;border-radius:.18cqw;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:55%;flex:1;display:flex;align-items:center;padding:.2cqw .4cqw}.wallet{display:flex;gap:.4cqw;align-items:center;padding:.4cqw;min-width:0}.coin{width:2.3cqw;height:2.3cqw;display:grid;place-items:center;color:#ffd775;border:.2cqw dashed #ffc65d;border-radius:50%;font-size:1.8cqw;font-weight:bold;flex-shrink:0;text-shadow:0 0 8px #ffc55377}.ua-coin{font-family:Arena,sans-serif;font-style:italic;color:#11c7ff;font-size:1.4cqw;letter-spacing:-.13cqw;border-color:#008bcb;box-shadow:inset 0 0 .6cqw #07c6ff}.wallet output{border:1px solid #28516a;background:#02070ad9;border-radius:.18cqw;width:100%;min-width:0;height:50%;font-size:.8cqw;display:flex;align-items:center;justify-content:center}.icon-button{position:relative;display:grid;place-items:center;padding:.85cqw;color:#d8efff}.icon-button>span[data-icon]{display:contents}.notification-dot{position:absolute;right:15%;top:14%;width:.7cqw;aspect-ratio:1;background:#ff003b;border-radius:50%;box-shadow:0 0 8px #f03}
.navigation{position:absolute;left:1.9%;top:31.4%;width:18.5%;height:52.5%;display:grid;grid-template-rows:repeat(8,1fr)}.nav-item{border:0;border-bottom:1px solid #3b7a9b69;background:linear-gradient(90deg,#00080eeb,#00080eac);display:grid;grid-template-columns:3cqw 1fr 1.5cqw;align-items:center;text-align:left;gap:1cqw;padding:.5cqw 1.1cqw;font:700 1.42cqw Arena,'Arial Narrow',sans-serif;position:relative}.nav-item:first-child,.nav-item:last-child{border-radius:.4cqw}.nav-item>span[data-icon]{width:2.4cqw;height:2.4cqw;color:#d9f1ff}.nav-item b{color:#a5d7ef;font:normal 2.6cqw Arial;line-height:1}.nav-item.active{border:2px solid #2ad9ff;border-radius:.6cqw;background:linear-gradient(100deg,#007ac36b,#011529e8);box-shadow:0 0 1.3cqw #00aaffbd,inset 0 0 .7cqw #078aff8c;transform:skewX(-5deg)}.nav-item.active>*{transform:skewX(5deg)}.nav-item.active [data-icon]{color:#f5fcff;filter:drop-shadow(0 0 5px #00aaff)}.nav-item.active b{color:#00bdff}
.event{position:absolute;left:78.3%;right:1.6%;top:11.8%;height:26.2%;padding:1.2cqw 1.3cqw;background:linear-gradient(110deg,#000812ed 35%,#041320a8),url('./assets/menu-scene.webp') 91% 45%/290% auto;display:flex;flex-direction:column;align-items:flex-start}.event-crown{width:1.25cqw;height:1.25cqw;color:#08bfff;margin-bottom:1.4cqw}.event>small{font:700 1.4cqw Arena,sans-serif;color:#ff174a}.event h1{font:700 2cqw Arena,sans-serif;margin:.3cqw 0}.event p{font-size:.87cqw;color:#afcadc;margin:0}.event>button{background:linear-gradient(#df0041,#a4002b);border:1px solid #ff174e;border-radius:.25cqw;padding:.65cqw .7cqw;margin-top:1.3cqw;font:700 1.02cqw Arena,sans-serif;box-shadow:0 0 1cqw #ff002530}.event-dots{align-self:center;display:flex;gap:.45cqw;margin-top:auto}.event-dots i{width:.55cqw;height:.55cqw;border-radius:50%;background:#6b8ca5}.event-dots i:first-child{background:#00d2ff}
.action-cards{position:absolute;left:22.8%;right:1.65%;top:65.4%;height:20.9%;display:grid;grid-template-columns:repeat(4,1fr);gap:1cqw}.action-card{position:relative;overflow:hidden;border:1px solid #20bcff;border-radius:.6cqw;background:#000b13;padding:0;transform:skewX(-5deg);box-shadow:inset 0 0 1cqw #007db54d}.card-art{position:absolute;inset:0 0 21% 0;background-image:url('./assets/reference.webp');background-size:550% 628%;transform:skewX(5deg) scale(1.05)}.roam .card-art{background-position:27.3% 77.6%}.online .card-art{background-position:50.9% 77.6%}.garage .card-art{background-position:74.3% 77.6%}.tuning .card-art{background-position:98% 77.6%}.card-label{position:absolute;inset:auto 0 0;height:36%;background:linear-gradient(0deg,#00101d 65%,#00101dea 85%,#00101d00);display:flex;align-items:center;justify-content:space-between;padding:1cqw .85cqw .55cqw;font:700 1.6cqw Arena,'Arial Narrow',sans-serif;transform:skewX(5deg);white-space:nowrap}.card-label b{font:normal 3.6cqw Arial;line-height:1;color:#00baff}
.news{position:absolute;left:1.9%;top:86.2%;width:19.4%;height:11.2%;text-align:left;padding:.5cqw .8cqw}.news strong{display:flex;justify-content:space-between;font:700 1.23cqw Arena,sans-serif}.news b{color:#0acbff;font:1.5cqw Arial}.news-body{display:flex;align-items:center;gap:.7cqw;height:65%;font-size:.72cqw;color:#a8c6d9}.news-art{height:100%;width:32%;border-radius:.25cqw;background:url('./assets/reference.webp') 2.8% 96.3%/1800% auto}.tasks{position:absolute;left:24%;top:88.2%;width:44.3%;height:9.2%;display:flex;align-items:center;gap:1.3cqw;padding:.7cqw 1.6cqw;text-align:left;transform:skewX(7deg)}.tasks>*{transform:skewX(-7deg)}.tasks [data-icon]{width:2.7cqw;height:2.7cqw}.gold{color:#ffd068}.tasks strong,.friends strong{font:700 1.2cqw Arena,sans-serif;display:block}.tasks small{display:block;font-size:.8cqw;color:#98b5cb;margin-top:.5cqw}.tasks b{margin-left:auto;font:2.7cqw Arial;color:#00beff}.friends{position:absolute;left:69%;right:2.1%;top:88.2%;height:9.2%;display:flex;align-items:center;gap:1cqw;padding:.7cqw 1.1cqw;text-align:left}.friends>[data-icon]{width:3cqw;height:3cqw;flex-shrink:0;color:#d9ecff}.friends-content{min-width:0;flex:1}.friends-content>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:.35cqw;font-size:.7cqw;color:#9dbece}.friend-slots{display:flex;gap:.5cqw}.friend-slots i{border:1px solid #72a9c8;border-radius:50%;width:2.5cqw;aspect-ratio:1;display:grid;place-items:center;font-style:normal;font-size:1.8cqw;color:#b5d1e5}.menu-status{position:absolute;bottom:.45%;left:24%;right:2%;display:flex;justify-content:space-between;font-size:.6cqw;color:#9cb7c7;text-shadow:0 1px 3px #000}
dialog{width:min(440px,calc(100vw - 32px));padding:32px;border:1px solid #27baff;border-radius:12px;background:linear-gradient(140deg,#061d2f,#020810);color:#e8f5ff;box-shadow:0 0 70px #001d35}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}dialog h2{font:700 30px Arena,sans-serif;margin:18px 0}dialog p{font-size:15px;line-height:1.6;color:#b3c9db}.dialog-kicker{font-size:10px;letter-spacing:3px;color:#02bdff}.dialog-close{position:absolute;right:10px;top:5px;border:0;background:none;font-size:30px;min-width:44px;min-height:44px}.dialog-ok,#dialog-confirm{min-height:44px;border:1px solid #1dbaff;border-radius:4px;padding:10px 24px;background:#082a40;margin-top:14px}.dialog-item{border-bottom:1px solid #143d55;padding-bottom:10px}.boot-error{margin:24px;color:#d1e5f5}.opening-controls .enter-arena:focus-visible{outline-offset:0}
@keyframes press{0%,100%{opacity:.65;text-shadow:0 0 4px #60ff31}50%{opacity:1;text-shadow:0 0 18px #60ff31}}@keyframes glow{0%,100%{opacity:.2}50%{opacity:1}}
@media(max-width:700px){
 body{display:block}.arena{width:100%;aspect-ratio:auto;min-height:100svh;overflow:visible;container-type:normal}.opening{position:fixed;height:100svh;overflow:hidden}.opening-art{background-size:auto 100%;background-position:53% center}.opening-art:after{content:'';position:absolute;inset:0;background:linear-gradient(#0001,transparent 60%,#000b)}.opening-credit{left:10%;top:auto;bottom:155px;width:80%;height:auto;background:#010906c4;padding:10px;font-size:10px;letter-spacing:3px}.opening-controls{left:6%;right:6%;top:auto;bottom:max(28px,env(safe-area-inset-bottom));padding:12px;background:#010805e6;border:1px solid #183e1a;border-radius:6px}.enter-arena{font-size:16px;letter-spacing:4px;min-height:44px}.opening-controls p{font-size:11px;line-height:1.6;margin:8px}.opening-controls progress{margin-top:10px}.menu{position:relative;display:flex;flex-direction:column;gap:14px;padding:14px 14px 22px;min-height:100svh;overflow:hidden}.menu-scene{background-size:auto 620px;background-position:57% 0;background-repeat:no-repeat;background-color:#020810}.menu-scene:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 270px,#020810a6 480px,#020810 750px)}.brand{position:relative;left:auto;top:auto;width:270px;height:108px;flex-shrink:0;background-size:344.83% 476.19%;margin-left:-6px}.developer{position:absolute;left:auto;right:14px;top:106px;gap:5px;font-size:11px}.developer small{font-size:9px}.signature{font-size:19px;text-shadow:0 -3px 0 #19b9ff}.topbar{position:relative;inset:auto;display:grid;height:auto;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:8px}.frame{border-radius:6px}.profile{grid-column:span 2;height:48px;padding:3px;gap:6px}.avatar{border-radius:4px}.nick{font-size:13px;height:70%;padding:4px}.wallet{height:48px;padding:5px;gap:5px}.coin{font-size:21px;width:25px;height:25px;border-width:2px}.ua-coin{font-size:15px;letter-spacing:-1px}.wallet output{height:26px;font-size:10px}.icon-button{height:44px;padding:10px;background:#05121bd6}.icon-button svg{width:23px;height:23px}.notification-dot{width:7px;right:24%;top:7px}.navigation{position:relative;inset:auto;width:100%;height:auto;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,62px);margin-top:126px;gap:5px}.nav-item{display:flex;flex-direction:column;gap:5px;justify-content:center;padding:7px 2px;font-size:13px;border:1px solid #236083a1;border-radius:5px;background:#03111ce8}.nav-item>span[data-icon]{width:22px;height:22px}.nav-item b{display:none}.nav-item.active{transform:none;border-radius:5px;box-shadow:0 0 12px #009aff80}.nav-item.active>*{transform:none}.event{position:relative;inset:auto;width:100%;height:auto;min-height:134px;order:4;padding:15px;background-size:270% auto}.event-crown{display:none}.event>small{font-size:15px}.event h1{font-size:24px;margin:4px 0}.event p{font-size:11px}.event>button{position:absolute;right:14px;bottom:22px;padding:12px 10px;font-size:12px;margin:0;max-width:45%;min-height:44px}.event-dots{margin:14px 0 0;align-self:flex-start;gap:6px}.event-dots i{width:5px;height:5px}.action-cards{position:relative;inset:auto;height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;order:3}.action-card{height:119px;border-radius:6px;transform:none}.card-art{transform:none;background-size:550% 628%}.card-label{transform:none;font-size:17px;padding:13px 9px 5px;height:40%;background:linear-gradient(0deg,#00101d 55%,#00101df0 85%,#00101d00)}.card-label b{font-size:32px}.news,.tasks,.friends{position:relative;inset:auto;width:100%;height:auto;min-height:75px;padding:12px;transform:none;order:5}.news strong,.tasks strong,.friends strong{font-size:16px}.news b{font-size:22px}.news-body{height:45px;gap:12px;font-size:12px}.news-art{width:68px;height:40px}.tasks{gap:15px}.tasks>*{transform:none}.tasks [data-icon]{width:33px;height:33px}.tasks small{font-size:12px;margin-top:6px}.tasks b{font-size:32px}.friends{gap:12px}.friends>[data-icon]{width:33px;height:33px}.friends-content>span{font-size:12px;margin-top:5px}.friend-slots{gap:5px}.friend-slots i{width:27px;font-size:20px}.menu-status{position:relative;inset:auto;font-size:10px;line-height:1.6;gap:6px;flex-direction:column;order:6}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}dialog::backdrop{backdrop-filter:none}}
/* Keep SVG intrinsic sizes from expanding the topbar's grid row. */
.arena-host{width:100%;min-width:0}.arena{margin-inline:auto}.menu:focus{outline:none}
@media(min-width:701px){.topbar{grid-template-rows:minmax(0,1fr)}.topbar>*{min-height:0;max-height:100%;overflow:hidden}.avatar{width:3.5cqw;max-height:100%}.icon-button svg{max-width:2.5cqw;max-height:2.5cqw}}
.brand{mix-blend-mode:normal}
.opening-credit{background:#09151c}.opening-controls{background:linear-gradient(90deg,transparent,#020c07 10%,#020c07 90%,transparent)}
@media(max-width:700px){body{justify-items:stretch}.arena-host{justify-self:stretch}.opening-art{background-size:100% auto;background-position:center 35%;background-color:#020a07}.opening-glow{inset:10% 0}.opening-controls{background:#010805}.event p{max-width:52%;line-height:1.4}.event>button{max-width:44%}}
/* The supplied signature remains a decorative sprite, not re-typeset branding. */
.signature{display:block;width:5.5cqw;height:4.4cqw;flex-shrink:0;font-size:0;transform:none;background:url('./assets/reference.webp') 2.7% 24.6% /1818% 1280%;mix-blend-mode:screen}
.avatar svg{fill:currentColor;stroke:none}
@media(max-width:700px){.signature{width:28px;height:26px;font-size:0}.developer{gap:5px}}

/* Optional H.264 layer follows the supplied still, including its mobile framing. */
.opening-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
@media(max-width:700px){.opening-video{object-position:center 35%}}
@media(prefers-reduced-motion:reduce){.opening-video{display:none!important}}
/* Pixel-measured logo crop: 32,5 / 474×192 in the 1672×941 reference. */
@media(min-width:701px){.brand{left:1.9139%;top:.53135%;width:28.3493%;height:20.4038%;background-size:352.7426% 490.1042%;background-position:2.6711% .66756%}}
/* Reference icon artwork is decoration inside independent, labelled HTML buttons. */
.nav-item>[data-icon]{background-image:url('./assets/reference.webp');background-size:3800% 2138.636%;background-position-x:2.9484%;mix-blend-mode:screen}
.nav-item>[data-icon]>svg{visibility:hidden}
.nav-item>[data-icon="home"]{background-position-y:34.00223%}
.nav-item>[data-icon="car"]{background-position-y:41.02564%}
.nav-item>[data-icon="tools"]{background-position-y:47.49164%}
.nav-item>[data-icon="flag"]{background-position-y:54.29208%}
.nav-item>[data-icon="users"]{background-position-y:61.20401%}
.nav-item>[data-icon="calendar"]{background-position-y:67.55853%}
.nav-item>[data-icon="cart"]{background-position-y:74.47046%}
.nav-item>[data-icon="settings"]{background-position-y:81.71683%}

.icon-button>span[data-icon]{display:block;width:100%;height:100%}
.icon-button [data-icon="users"],.icon-button [data-icon="settings"],.icon-button [data-icon="power"],.friends>[data-icon],.tasks>[data-icon]{background-image:url('./assets/reference.webp');background-size:3800% 2138.636%;mix-blend-mode:screen}
.icon-button [data-icon="users"]{background-position:84.8894% 2.34114%}
.icon-button [data-icon="settings"]{background-position:93.73464% 2.34114%}
.icon-button [data-icon="power"]{background-position:98.15725% 2.34114%}
.icon-button :is([data-icon="users"],[data-icon="settings"],[data-icon="power"])>svg,.friends>[data-icon]>svg,.tasks>[data-icon]>svg{visibility:hidden}
.friends>[data-icon]{background-size:2985.714% 1680.357%;background-position:72.64851% 95.70621%}
.tasks>[data-icon]{background-size:3344% 1882%;background-position:26.20222% 94.94949%}
@media(max-width:700px){.brand{mix-blend-mode:screen}.icon-button>span[data-icon]{width:23px;height:23px}}

/* Sandbox cosmetics: visual only; never overlays game canvas. */
.profile.ua-frame-neon .avatar{border:2px solid #7fff32;box-shadow:0 0 0 2px #00c8ff,0 0 12px #75ff19,inset 0 0 8px #00d5ff;animation:ua-frame-pulse 2.2s ease-in-out infinite}
.shop-action{width:100%;min-height:46px;margin:8px 0 0;padding:10px 14px;background:#083126;border:1px solid #72ff39;border-radius:6px;color:#eaffef;font-weight:700}
.shop-action:disabled{opacity:.55}
@keyframes ua-frame-pulse{50%{box-shadow:0 0 0 2px #00c8ff,0 0 22px #75ff19,inset 0 0 10px #00d5ff}}

/* Account dialog input layout, kept independent of the renderer. */
.auth-form{display:grid;gap:10px;margin-top:12px}
.auth-field{display:grid;gap:5px;color:#c6e8fa;font-size:13px}
.auth-field input{width:100%;min-height:44px;border:1px solid #347797;border-radius:6px;padding:10px;color:#fff;background:#03121e;font:inherit}
.auth-field input:focus-visible{outline:2px solid #7fff32;outline-offset:2px}
.auth-switch{min-height:44px;background:none;border:0;color:#7ad9ff;text-decoration:underline;margin-top:8px}
.auth-status{color:#ffb6b6;min-height:1em}

