/* Responsive adaptation. Original desktop geometry stays intact at >=1232px. */
.mobile-menu-toggle{display:none}
.module-table-scroll{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
@media(max-width:1231px){
 html{scroll-padding-top:16px}body{overflow-x:visible}
 .wrapper{width:100%;max-width:1200px;padding:0 16px}
 .wrapper>.container{width:100%;max-width:none;min-width:0;margin-left:0;margin-right:0;background-size:100% auto;padding-bottom:36px!important}
 main.content{width:100%;min-width:0;display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);align-items:start}
 main.content>*{min-width:0;max-width:100%}
 .top{grid-column:1;grid-row:1;display:block}
 .widget-account-panel{grid-column:2;grid-row:1;width:100%;float:none;background-size:100% auto}
 .fast-links{grid-column:1/-1;grid-row:2;width:100%;gap:0}
 .last-news{grid-column:1;grid-row:3;float:none;width:100%;padding:0 24px;background-size:100% auto}
 .right-sidebar{grid-column:2;grid-row:3;float:none;width:100%}
 .top-panel{position:relative;min-height:76px;padding:8px 20px;justify-content:space-between;flex-wrap:wrap;background-color:#eff9fc}
 .logo-top-smoll{margin:0}.logo-top-smoll img{max-width:150px;max-height:64px;object-fit:contain}
 .mobile-menu-toggle{display:flex;align-items:center;gap:10px;min-height:44px;padding:9px 16px;background:#0a5b75;color:#fff;border:1px solid #20778e;border-radius:4px;font:600 16px Arial,sans-serif;cursor:pointer}
 .mobile-menu-toggle:before{content:'☰';font-size:22px}.mobile-menu-toggle[aria-expanded=true]:before{content:'×'}
 #navbar{width:100%;display:none}body.mobile-nav-open #navbar{display:block}
 #navbar .menu{display:flex;flex-direction:column;align-items:stretch;gap:0;margin:10px 0 0;padding:0}
 #navbar .menu li{margin:0;list-style:none}#navbar .menu a{padding:12px 14px;line-height:1.4;min-height:44px;font-size:16px;border-top:1px solid #9dbdc866}
 #navbar .menu a:after{display:none}
 .header{min-height:390px}.header .logo{left:0;top:75px;width:min(70%,600px)}
 .header .logo img{width:100%;max-width:100%;height:auto}
 .leaves,.sparks{pointer-events:none;max-width:100%}
 .button-top{gap:30px;flex-wrap:wrap}.button-top .download-block,.button-top .registration-block{margin:0;max-width:100%;background-size:100% 100%}
 .slider{float:none;width:100%;height:350px}.slider .slides{display:flex;float:none;height:100%}.slider .slides .slide{float:none;flex-shrink:0;width:100%;height:350px;background-size:cover}
 .slider .slides .slide-info{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:8px;padding:30px 26px 44px;text-align:right}
 .slide-info span{width:auto;height:auto;margin:0;font-size:28px;line-height:1.1}
 .slide-text-big{width:auto;height:auto;margin:0;font-size:44px;line-height:1.1}
 .slide-text p,.slide-text1 p{width:auto;padding:0;margin:0;font-size:18px;line-height:1.35}
 .fast-links>a{width:calc(100% / 3);min-width:0;background-size:cover;padding-left:20px}
 .fast-links>a:before{max-width:100%;background-size:contain}
 .input-user input{max-width:calc(100% - 32px);font-size:16px}
 .widget-content-content{padding:0 20px}.server{padding:0 16px 24px}.img-online{left:auto;right:16px}
 .server .progress-bar{width:100%;max-width:357px;float:none;background-size:100% 100%}.progress-bar:after{background-size:100% 100%}
 .top-block .top-name{width:auto;flex:1;min-width:0}.top-block .top-lvl{width:44px;flex:none}.top-block.guild .score{padding-left:10px}.top-title,.top-list{min-width:0}
 .last-news img,.last-news video,.last-news iframe{max-width:100%}.last-news img{height:auto}.last-news .news-content-title-title,.last-news .news-content-title,.last-news .news-text,.last-news .news-content{max-width:100%;width:auto;float:none}
 .last-news .news-img{max-width:100%;height:auto}.last-news .news-img img{max-width:100%;height:auto}
 .last-news input:not([type=checkbox]):not([type=radio]),.last-news select,.last-news textarea{max-width:100%;font-size:16px}
 .last-news p,.last-news h1,.last-news h2,.last-news h3,.last-news a{overflow-wrap:anywhere}
 .castle-siege-banner{width:100%;max-width:100%}.csinfo_content{height:auto;margin-left:0}.csinfo_ginfo table{width:100%;max-width:100%}
 .footer>.footer{min-height:0}.footer .flex-s-c{gap:18px;flex-wrap:wrap;justify-content:space-around}.footer-block-coperite,.footer-block-r,.footer-block-c{float:none;max-width:100%;padding:25px 12px;text-align:center}
 .modal_window{width:calc(100vw - 32px)!important;max-width:680px;left:50%!important;right:auto!important;margin-left:0!important;transform:translateX(-50%)!important;max-height:calc(100dvh - 40px);overflow:auto}
}
@media(max-width:900px){
 main.content{grid-template-columns:minmax(0,1fr)}
 .top{grid-column:1;grid-row:1}.widget-account-panel{grid-column:1;grid-row:2;padding-bottom:22px;background-size:100% auto}
 .fast-links{grid-column:1;grid-row:3}.last-news{grid-column:1;grid-row:4;padding:0 22px}.right-sidebar{grid-column:1;grid-row:5}
 .widget-account-panel form{max-width:440px;margin:auto}.widget-account-panel .account-panel-title{padding-top:24px}
 .right-sidebar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:16px}.right-sidebar .widget-right{min-width:0}
 .header{min-height:330px}.leaves,.sparks{display:none}
 .widget-title{background-size:100% 100%}
}
@media(max-width:600px){
 .wrapper{padding:0 10px}body{background-size:auto 780px,auto 600px}
 .top-panel{padding:8px 14px;min-height:68px}.logo-top-smoll img{max-height:52px;max-width:120px}
 .header{min-height:250px}.header .logo{width:min(85%,390px);left:50%;top:40px;transform:translateX(-50%)}
 .button-top{gap:8px;flex-direction:column}.button-top .download-block,.button-top .registration-block{width:min(314px,100%);height:126px}
 .wrapper>.container{margin-top:18px}.slider,.slider .slides .slide{height:280px}
 .slider .slides .slide-info{padding:24px 22px 48px;background:linear-gradient(90deg,transparent,#052c4b55)}
 .slide-info span{font-size:25px}.slide-text-big{font-size:38px}.slide-text p,.slide-text1 p{font-size:16px}
 .slider .arrows{min-width:44px;min-height:44px}.slider .navigation{gap:8px}
 .fast-links{flex-direction:column;gap:10px;margin-top:12px}.fast-links>span{display:none}.fast-links>a{width:100%;max-width:100%;min-height:115px;padding-left:24px;background-position:center;background-size:cover}
 .fast-links>a span{font-size:23px}.fast-links>a p{font-size:14px;line-height:1.4}
 .last-news{padding:0 16px;margin-top:16px}.right-sidebar{grid-template-columns:minmax(0,1fr);gap:0}
 .widget-content-content{padding:0 18px}.widget-title{background-size:auto 100%;background-position:center}
 .input-user input{font-size:16px}.button-login,.button-small{min-height:44px}.lost{line-height:1.8;padding:6px 12px}.lost a{display:inline-block;padding:6px 0}
 .news-img,.news-content-img{float:none;width:100%;max-width:100%;margin:0 0 12px}.news-text-bottom{float:none;display:flex;flex-wrap:wrap;gap:10px}.news-content-title-title{line-height:1.4}
 .last-news .row{margin-left:-8px;margin-right:-8px}.last-news [class*=col-]{padding-left:8px;padding-right:8px;min-width:0}
 .last-news .form-group{margin-bottom:16px}.last-news .btn{min-height:42px;white-space:normal}.pagination{padding-top:24px;flex-wrap:wrap;gap:6px}.page-numbers{margin:0;min-width:38px}
 .csinfo_glogo,.csinfo_ginfo{float:none;width:100%;height:auto;margin-bottom:16px}.csinfo_glist li{float:none;width:100%}.castle-siege-banner{display:flex;flex-wrap:wrap;gap:16px;padding:16px}.castle-siege-banner>div{width:100%}
 .castle-siege-banner .guild_owner,.castle-siege-banner .guild_master,.castle-siege-banner .guild_countdown{font-size:30px}
 .profiles_guild_card,.profiles_player_card{padding:16px}.tos_list li p{text-align:left;padding-right:0}
 .footer .flex-s-c{flex-direction:column;align-items:center;gap:0}.footer-block-coperite,.footer-block-r,.footer-block-c{padding:18px 8px}.footer-block-coperite br{display:none}
 .rankings_menu a{width:auto;min-width:100px;min-height:40px;padding:9px}.rankings-class-filter{padding:10px 0;max-width:100%}.rankings-class-filter img{max-width:44px;height:auto}
 .last-news .table-responsive{max-width:100%;overflow:auto}.module-table-scroll{margin:12px 0}.module-table-scroll:focus-visible{outline:2px solid #0a5b75;outline-offset:2px}
}
@media(prefers-reduced-motion:reduce){.slider .slides{transition:none}.leaves,.sparks{display:none}}
.slider .navigation button.dot{padding:0;border:0;cursor:pointer}.slider .navigation button.dot:focus-visible,.mobile-menu-toggle:focus-visible{outline:2px solid #0a5b75;outline-offset:4px}
@media(max-width:1231px){.mobile-menu-toggle{width:auto;height:auto;flex:none;padding:8px 14px;min-height:44px;transition:none}.fast-links>a{overflow:hidden}.fast-links>a:before,.fast-links>a:hover:before{left:auto;right:0;max-width:60%}}
@media(max-width:1231px){.header .logo{transition:filter .3s}.slider .navigation .dot,.slider .navigation .dot.active{position:relative;width:44px;height:44px;margin:0;background:none;flex:none}.slider .navigation .dot:before{content:"";position:absolute;width:6px;height:6px;background:#fff;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}.slider .navigation .dot.active:before{width:10px;height:10px;background:#2aadc8;box-shadow:0 0 0 2px #fff8}.slider .navigation .dot.active:after{display:none}}
.slider .navigation button.dot{background-image:none}.slider .navigation button.dot:focus-visible,.mobile-menu-toggle:focus-visible{outline:2px solid #0a5b75!important;outline-offset:4px}

/* Overlay navigation never changes the header height. */
@media(max-width:1231px){
 .top-panel{position:relative;z-index:100}
 #navbar{position:absolute;top:100%;left:0;right:0;width:100%;max-height:calc(100dvh - 80px);overflow-y:auto;overscroll-behavior:contain;background:#f1fafdf7;border-bottom:1px solid #8bb7c5;box-shadow:0 14px 24px #13384733;z-index:101}
 #navbar .menu{margin:0;padding:8px 14px}
 main.content>.top{display:contents}main.content>.top>.slider{grid-column:1;grid-row:1}
 .panel-usercp{width:100%;max-width:100%;float:none;margin:0 0 20px}
 .panel-usercp>.panel-heading{padding:14px 16px}
 .panel-usercp .panel-heading .panel-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;line-height:1.4;margin:0;overflow-wrap:anywhere}
 .panel-usercp .panel-heading .panel-title>a,.panel-sidebar .panel-heading .btn{float:none!important;display:inline-flex;align-items:center;justify-content:center;width:auto;max-width:100%;height:auto;min-height:42px;padding:9px 14px;white-space:nowrap;font-size:14px;line-height:1.4;flex-shrink:0;text-align:center}
 .panel-usercp ul li{display:flex;align-items:center;gap:8px;min-height:42px;line-height:1.5;padding:6px 0}
 .panel-usercp ul li img{width:22px;height:22px;object-fit:contain;padding:0;flex:none;top:auto}
 .panel-usercp ul li a{min-width:0;overflow-wrap:anywhere}
 .widget-account-panel .account-panel-title{padding:20px 16px 10px;text-align:center;line-height:1.4}
 .widget-account-panel .lk-form{padding:0 20px}.widget-account-panel .lk-form li{display:flex;align-items:center;gap:8px;min-height:42px;line-height:1.4}.widget-account-panel .lk-form li img{width:22px;height:22px;object-fit:contain;flex:none}
}
@media(max-width:900px){main.content>.top>.slider{grid-column:1;grid-row:1}.widget-account-panel{grid-column:1;grid-row:2}}
@media(max-width:600px){.slide-text-big{font-size:clamp(27px,8.5vw,38px)}.slide-text p,.slide-text1 p{font-size:15px}.fast-links>a span{font-size:21px}.download-block a,.registration-block a{font-size:22px}}
@media(min-width:1232px){.slide-text-big{font-size:50px}}

/* Main module and sidebar have their own layout, independent of the hero. */
.module-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);width:100%;min-width:0;clear:both;align-items:start}
.module-layout>.last-news,.module-layout>.right-sidebar{float:none;width:100%;max-width:100%;min-width:0;grid-column:auto;grid-row:auto}
.module-layout .panel-usercp{width:100%;max-width:100%;clear:both;float:none}
.module-layout .panel-usercp .panel-heading{height:auto;padding:15px 16px}
.module-layout .panel-usercp .panel-heading .panel-title{display:flex;flex-direction:column;align-items:flex-start;gap:10px;line-height:1.5;margin:0;white-space:normal;overflow-wrap:anywhere}
.module-layout .panel-usercp .panel-heading .panel-title>a{float:none!important;display:inline-flex;align-items:center;justify-content:center;flex:none;white-space:nowrap;width:auto;max-width:100%;height:auto;min-height:42px;padding:9px 14px;line-height:1.4;font-size:14px}
@media(max-width:1231px){main.content>.module-layout{grid-column:1/-1;grid-row:3;grid-template-columns:minmax(0,2fr) minmax(280px,1fr)}}
@media(max-width:900px){main.content>.module-layout{grid-column:1;grid-row:4;grid-template-columns:minmax(0,1fr)}.module-layout>.last-news,.module-layout>.right-sidebar{grid-column:1;grid-row:auto}.module-layout>.right-sidebar{clear:both;margin-top:20px}}
/* WebEngine's native user panel also supports narrow screens. */
@media(max-width:767px){#content>.col-xs-8,#content>.col-xs-4{float:none!important;width:100%;max-width:100%;clear:both}#content>.col-xs-4{margin-top:20px}.panel-usercp .panel-heading .panel-title{display:flex;flex-direction:column;align-items:flex-start;gap:10px;white-space:normal;line-height:1.5}.panel-usercp .panel-heading .panel-title>a{white-space:nowrap;float:none!important;width:auto;min-height:42px;padding:9px 14px;line-height:1.4}}
