/* Approved header controls. Landing retains the existing background and blur in style.css. */
body #main_header{--header-badge-ring:var(--game-darker)}
body.cms_studio #main_header{--header-badge-ring:var(--game-dark)}
body #main_header :is(#chat_icon,#notification_icon)>a{display:grid;place-items:center;position:relative;width:40px;height:40px;box-sizing:border-box;border:1px solid var(--studio-line);border-radius:10px;background:var(--studio-surface);color:var(--studio-subtle);cursor:pointer;transition:background .15s,border-color .15s,color .15s}
body #main_header :is(#chat_icon,#notification_icon)>a>.header_glyph{display:block;position:static;transform:none;width:18px;height:18px}
body #main_header :is(#chat_icon,#notification_icon)>a:hover{background:var(--studio-hover);border-color:var(--studio-switch-border);color:var(--studio-text)}
body #main_header :is(#chat_icon,#notification_icon)>a[aria-expanded=true]{background:var(--studio-selected);border-color:var(--studio-purple);color:var(--studio-purple)}
body #main_header :is(#chat_icon,#notification_icon)>a:focus-visible{outline:2px solid var(--studio-purple);outline-offset:4px}
body #main_header #chat_icon .amount{top:-6px;right:-5px;width:auto;min-width:17px;height:17px;padding:0 4px;box-sizing:border-box;border-radius:7px;background:var(--studio-purple);color:var(--studio-sidebar);font-size:10px;font-weight:600;line-height:17px;box-shadow:0 0 0 3px var(--header-badge-ring)}
/* Keep the numeric text for existing notification count updates; only its presentation is a dot. */
body #main_header #notification_icon>.menu_open>.amount{top:5px;right:6px;width:6px;height:6px;padding:0;border-radius:50%;background:var(--studio-purple);font-size:0;line-height:0;box-shadow:none}
body #main_header .header_tooltip{display:none;position:absolute;top:49px;left:50%;transform:translateX(-50%);white-space:nowrap;background:var(--studio-hover);border:1px solid var(--studio-line);border-radius:5px;padding:4px 8px;font:400 11px/1.6 'Noto Sans',sans-serif;color:var(--studio-text);pointer-events:none}
body #main_header :is(#chat_icon,#notification_icon)>a[aria-expanded=false]:focus-visible .header_tooltip{display:block}
body #main_header .header_external,body #main_header .header_start{display:none}
@media(hover:hover){body #main_header :is(#chat_icon,#notification_icon)>a[aria-expanded=false]:hover .header_tooltip{display:block}}

body.landing{padding-top:80px}
body.landing #main_header,body.landing #main_header header.main_header{height:80px}
body.landing #main_header>.div_module{width:100%;max-width:1464px;padding:0 32px;margin:0 auto;box-sizing:border-box}
body.landing #main_header header.main_header{align-items:center;gap:24px}
body.landing #main_header header.main_header>.left{gap:48px;flex-shrink:0}
body.landing #main_header .left .logo{display:block;height:auto;line-height:0}
body.landing #main_header .left .logo img{width:126px;height:auto}
body.landing #main_header .left .text_menu .list{gap:32px}
body.landing #main_header .left .text_menu .item{display:flex;align-items:center;gap:7px;font-size:14px;text-transform:none;font-weight:400;color:var(--studio-subtle);text-decoration:none}
body.landing #main_header .left .text_menu .item:hover{color:var(--studio-text)}
body.landing #main_header .left .text_menu .item:focus-visible{outline:2px solid var(--studio-purple);outline-offset:6px;border-radius:3px}
body.landing #main_header .left .text_menu .header_external{display:block;width:13px;height:13px;opacity:.6}
body.landing #main_header header.main_header>.right{align-items:center;gap:20px;padding:0}
body.landing #main_header #chat_icon{margin-right:-12px}
body.landing #main_header .right>.profile{padding-left:21px;margin-left:0}
body.landing #main_header .right>.profile::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:24px;background:var(--studio-line)}
body.landing #main_header .right>.profile>.menu_open{display:flex;align-items:center;justify-content:center;min-width:34px;height:40px;border-radius:50%}
body.landing #main_header .right>.profile>.menu_open:focus-visible{outline:2px solid var(--studio-purple);outline-offset:4px}
body.landing #main_header .right>.profile>.menu_open .user_profile_div{height:34px}
body.landing #main_header .right>.profile>.menu_open .user_image{outline:1px solid var(--studio-switch-border);outline-offset:2px}
body.landing #main_header .right>.login{align-items:center;gap:20px}
body.landing #main_header .right>.login:not([style*="display:none"]):not([style*="display: none"]){display:flex}
body.landing #main_header .right>.login button{width:auto;min-width:0;min-height:40px;padding:10px 17px;border:1px solid var(--studio-switch-border);border-radius:9px;font:500 13px/1.5 'Noto Sans',sans-serif;box-shadow:none}
body.landing #main_header .right>.login .header_login{padding:10px 0;color:var(--studio-subtle);border:0;background:none}
body.landing #main_header .right>.login .header_login:hover{color:var(--studio-text)}
body.landing #main_header .right>.login .header_start{display:flex;align-items:center;gap:12px;background:var(--game-primary);color:var(--studio-text)}
body.landing #main_header .right>.login .header_start:hover{background:var(--game-accent)}
body.landing #main_header .right>.login .header_start svg{display:block;width:16px;height:16px;margin:0}
body.landing #main_header .right>.login button:focus-visible{outline:2px solid var(--studio-purple);outline-offset:4px}
@media(min-width:800px){body.landing #main_header .left>.redirect_menu{display:none}body.landing #main_header .left>.text_menu{display:block}}
@media(max-width:799px){
 body.landing{padding-top:72px}
 body.landing #main_header,body.landing #main_header header.main_header{height:72px}
 body.landing #main_header>.div_module{padding:0 16px}
 body.landing #main_header header.main_header{gap:14px}
 body.landing #main_header header.main_header>.left{gap:14px}
 body.landing #main_header .left .logo img{width:105px}
 body.landing #main_header .left>.text_menu{display:none}
 body.landing #main_header .left>.redirect_menu{display:block}
 body.landing #main_header .left .redirect_menu .touch{display:grid;place-items:center;width:28px;font-size:18px;color:var(--studio-subtle)}
 body.landing #main_header header.main_header>.right{gap:12px}
 body.landing #main_header #chat_icon{margin-right:-5px}
 body.landing #main_header .right>.profile{padding-left:0}
 body.landing #main_header .right>.profile::before{display:none}
 body.landing #main_header .right>.login{gap:12px}
 body.landing #main_header .right>.login button{padding:9px 12px;font-size:11px}
 body.landing #main_header .right>.login .header_login{padding:9px 0;font-size:12px}
 body.landing #main_header .right>.login button text{display:inline}
 body.landing #main_header .right>.login button svg{display:none!important}
}
@media(prefers-reduced-motion:reduce){body #main_header :is(#chat_icon,#notification_icon)>a{transition:none}}
