html{--header-primary:url('/static/uo-header-night-primary-v1.webp');--header-secondary:url('/static/uo-header-night-secondary-v1.webp');--header-action-ink:#eee0bd;--header-action-shadow:#0008;--header-action-halo:#cab78840}
html[data-uo-theme='light']{--header-primary:url('/static/uo-header-light-primary-v1.webp');--header-secondary:url('/static/uo-header-light-secondary-v1.webp');--header-action-ink:#3f3525;--header-action-shadow:transparent;--header-action-halo:#a88a5035}
html[data-uo-theme='northern']{--header-primary:url('/static/uo-header-northern-primary-v1.webp');--header-secondary:url('/static/uo-header-northern-secondary-v1.webp');--header-action-ink:#eee2c9;--header-action-shadow:#0008;--header-action-halo:#b2c6d340}
html body #crm #tb-right :is(#tb-play,#tb-signin){position:relative;isolation:isolate;height:40px!important;min-height:40px!important;padding:0 25px!important;display:inline-flex;align-items:center;justify-content:center;border:0!important;border-image:none!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:var(--header-action-ink)!important;text-shadow:0 1px 1px var(--header-action-shadow)!important;font:600 13px/20px 'Segoe UI',Arial,sans-serif!important;letter-spacing:0!important;text-transform:none!important;white-space:nowrap;filter:none!important;transition:transform .18s ease!important}
html body #crm #tb-right #tb-play{min-width:150px}
html body #crm #tb-right #tb-signin{min-width:88px}
html body #crm #tb-right :is(#tb-play,#tb-signin)::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;border:0 solid transparent;border-image-source:var(--header-secondary);border-image-slice:0 60 fill;border-image-width:0 27px;border-image-outset:0;border-image-repeat:stretch;filter:drop-shadow(0 2px 2px #0004);transition:filter .18s ease}
html body #crm #tb-right #tb-play::before{border-image-source:var(--header-primary)}
@media(hover:hover){html body #crm #tb-right :is(#tb-play,#tb-signin):hover{transform:translateY(-1px) scale(1.025)!important}html body #crm #tb-right :is(#tb-play,#tb-signin):hover::before{filter:drop-shadow(0 0 5px var(--header-action-halo)) drop-shadow(0 3px 3px #0005)}}
html body #crm #tb-right :is(#tb-play,#tb-signin):active{transform:translateY(1px)!important}
html body #crm #tb-right :is(#tb-play,#tb-signin):focus-visible{outline:2px solid var(--g1)!important;outline-offset:2px}
/* Form text uses one typeface with both Cyrillic and Latin glyphs. */
html body #login-screen :is(.lbtn,.ltab,.linput,.lmsg,.login-sub,#reg-email-show){font-family:'Segoe UI',Arial,sans-serif!important;font-style:normal!important;text-transform:none!important;letter-spacing:normal!important}
html body #login-screen .lbtn{font-size:14px!important;font-weight:600!important;line-height:22px!important;text-shadow:none!important;padding:10px 26px!important;min-height:44px!important}
html body #login-screen #reg-choose .lbtn{background:transparent!important;border:0!important;border-image:var(--header-primary) 0 60 fill / 0 29px / 0 stretch!important;border-radius:0!important;color:var(--header-action-ink)!important;box-shadow:none!important;filter:none!important}
html body #login-screen #reg-choose .lbtn svg{stroke:currentColor!important;flex-shrink:0}
html body #login-screen .linput{font-size:16px!important;font-weight:400!important}
html body #login-screen :is(#reg-code,#rec-email-code){letter-spacing:4px!important;font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:reduce){html body #crm #tb-right :is(#tb-play,#tb-signin),html body #crm #tb-right :is(#tb-play,#tb-signin)::before{transition:none!important}html body #crm #tb-right :is(#tb-play,#tb-signin):hover{transform:none!important}}
