/* Tương thích các trình duyệt Chromium cũ (Coowon/Chromium 32).
   Áp dụng bố cục và cỡ chữ thống nhất cho tất cả trình duyệt. */
html,html body {width:100%;max-width:100%;color:#0c2942;}
html .global-header {display:block;width:100%;}
html .global-header .global-header-inner {
 display:block !important; width:100%; min-height:91px; height:auto;
 padding:16px 24px !important; margin:0 !important; zoom:1;
}
html .global-header .global-header-inner:after {
 content:"";display:block;clear:both;
}
html .global-header .global-logo {
 display:block !important;float:left !important;width:210px !important;
 margin:0 !important; padding:0 !important;
 color:#fff !important;text-align:left;
}
html .global-header .global-logo span {display:block !important;}
html .global-header .global-nav {
 display:block !important;float:right !important;width:auto !important;
 max-width:calc(100% - 224px);min-width:0;white-space:nowrap;
 margin:0 !important;padding:7px 0 0 !important;text-align:right;
}
html .global-header .global-nav a,
html .global-header .global-nav a.nav-current {
 display:inline-block !important; width:auto !important; min-width:88px;
 height:42px !important; min-height:42px !important;
 margin:0 0 0 7px !important;padding:11px 11px !important;
 vertical-align:middle; white-space:nowrap;
 text-align:center; line-height:18px !important;
 font-family:Arial,Helvetica,sans-serif;font-size:12px;font-weight:bold;
 background:#f7fbff !important;color:#1b628f !important;
 border:1px solid #bfddf0 !important;border-radius:8px;
 text-decoration:none !important;
}
html .global-header .global-nav a:hover {background:#deeffb !important;}
html .global-header .global-nav a.nav-current,
html .global-header .global-nav a[aria-current="page"] {
 background:#ffe9b3 !important;color:#80500d !important;
 border-color:#d3a046 !important;
}
/* Trang chủ: 2 cột cố định bằng float/margin, không lệ thuộc CSS Grid. */
html .wrap {display:block !important;width:100% !important;max-width:none !important;
 margin:0 !important;padding:14px 20px 28px !important;min-height:0;}
html .wrap>.layout {display:block !important;width:100%;min-width:0;zoom:1;}
html .wrap>.layout:after {content:"";display:block;clear:both;}
html .wrap>.layout>.left {display:block !important;float:left !important;width:320px !important;max-width:320px;}
html .wrap>.layout>.mid {display:block !important;float:none !important;
 width:auto !important;max-width:none !important;margin-left:342px !important;min-width:0;}
html .wrap>.layout>.mid>.panel {width:100%;}
html .mid>.panel:first-child .panel-pad {display:block !important;}
html .mid>.panel:first-child .server {display:block;width:100%;margin-bottom:7px !important;}
html .pair {display:block !important;zoom:1;}
html .pair:after {content:"";display:block;clear:both;}
html .pair>.panel {display:inline-block;vertical-align:top;width:49%;margin-right:.5%;}
/* Các trang dữ liệu vẫn chiếm bề ngang cần thiết. */
html .cards {display:block;zoom:1;}
html .cards:after {content:"";display:block;clear:both;}
html .hero-card {display:inline-block;vertical-align:top;width:30%;}
@media (max-width:970px) {
 html .global-header .global-header-inner{padding:13px 15px !important;}
 html .global-header .global-logo {float:none !important;width:100% !important;margin-bottom:10px !important;}
 html .global-header .global-nav {float:none !important;display:block !important;
  width:100% !important;max-width:none;text-align:left;white-space:normal;}
 html .global-header .global-nav a {margin:0 6px 7px 0 !important;}
 html .bank-detail .reward-plain {width:230px;}
}
@media (max-width:650px) {
 html .wrap {padding:12px !important;}
 html .wrap>.layout>.left {float:none !important;width:100% !important;max-width:none !important;}
 html .wrap>.layout>.mid {margin:12px 0 0 !important;width:100% !important;}
 html .pair>.panel {width:100%;margin-right:0;}
 html .global-header .global-nav a,
 html .global-header .global-nav a.nav-current {width:31% !important;min-width:0;margin:0 1% 7px 0 !important;padding:10px 2px !important;font-size:11px;}
 html .bank-detail {display:block !important;}
 html .bank-detail>a,
 html .bank-detail .bank-info,
 html .bank-detail .reward-plain {display:block !important;width:100% !important;}
 html .bank-detail .bank-info{padding:14px 0;}
 html .bank-detail .reward-plain{padding:10px 0 0 !important;border-left:0 !important;border-top:1px solid #bdd8ec;}
 html .amount-grid>.amount {width:48%;}
 html .hero-card {width:95%;}
}

/* Legible text and old Chromium layout, isolated from modern browsers. */
html body{font-family:Arial,Helvetica,sans-serif;font-size:15px;color:#173e5c}
html main{padding:18px 24px 30px}
html .global-header .global-nav a{font-size:14px;min-width:100px}
html .panel,html .section,html .controls,html .hero-card{background:#f7fbff}
html .auth .panel-pad{padding:25px}html .auth label{font-size:15px}html .auth input{height:49px;font-size:17px}html .auth .primary{font-size:17px;min-height:50px}
html .links{font-size:13px;color:#365e79}html .links a{color:#145f91}
html .server{min-height:76px;padding:16px;margin-top:10px;color:#34566e}
html .server strong{font-size:17px}html .server small{font-size:14px}
html .server:disabled{background:#e8f0f6;color:#526c80;opacity:1}
html .newsrow{font-size:14px;line-height:1.6}html .newsrow small{font-size:12px}
html .cards{font-size:0}html .hero-card{font-size:14px;width:30%;margin:0 1% 20px}
html .card-head{display:block;min-height:126px;padding:18px}
html .portrait-wrap{float:left;width:84px;margin:0 14px 10px 0}html .identity{margin-left:98px}
html .card-head:after{content:"";display:block;clear:both}
html .identity h2{font-size:19px}html .skill h3{font-size:16px}html .skill p{font-size:14px;line-height:1.8;color:#24475e}
html .recruit-info p,html .recruit-info strong{font-size:13px;color:#2c516c}
html .banner,html .hero{padding:28px 30px}
html .banner:before,html .hero:before{top:0;right:0;bottom:0;left:0}
html .banner h1,html .hero h1{font-size:34px;line-height:1.3}
html .search-row{display:block}html .search-row label{display:inline-block;width:30%;margin:0 1% 12px 0;vertical-align:bottom}
html .search-row label:first-child{width:48%}html .search-row input,html .search-row select{font-size:15px}
html .group-tabs,html .quality-filters,html .filters{display:block}
html .group-tabs button,html .quality-filter,html .filter{display:inline-block;margin:0 8px 8px 0;font-size:14px;padding:10px 14px}
html .chain{display:block;white-space:normal;overflow:visible;padding:18px 20px;font-size:0}
html .chain .unit{display:inline-block;vertical-align:top;width:160px;margin:0 25px 18px 0;padding:12px 8px;font-size:14px;white-space:normal}
html .unit strong{font-size:14px;line-height:1.5}html .unit img{width:86px;height:86px}
html .attack-preview{font-size:12px;color:#365770;height:75px}html .attack-button{font-size:13px;padding:8px}
html .attack-description{font-size:15px;color:#173e5c}html .branch-heading{padding:18px 20px}
html .guide-page .layout>aside{background:#f7fbff}
html .guide-page aside a{font-size:14px;line-height:1.5;color:#174e77;padding:12px 10px}
html .guide-page .section{padding:24px}html .guide-page th,html .guide-page td{font-size:14px;line-height:1.7;padding:12px}
html .guide-page .section p,html .guide-page .rewards{font-size:14px;color:#2c516c}
html .amount-grid{display:block}html .amount{display:inline-block;width:23%;margin:0 1% 12px 0;font-size:16px;min-height:66px}
html .bank-detail.qr-after-continue{display:block}html .bank-detail .bank-info{display:block;padding:0}
html .bank-detail .reward-plain{display:block;width:auto;font-size:14px;padding:16px 0 0}
html .summary .line{display:block;min-height:34px;font-size:15px}html .summary .line strong{float:right}
html .nl-modal-box{background:#fff}html .qr-details dd{color:#173e5c}
@media(max-width:1100px){html .hero-card{width:46%;margin:0 1% 18px}}
@media(max-width:970px){html .wrap>.layout>.left{width:290px!important;max-width:290px}html .wrap>.layout>.mid{margin-left:308px!important}}
@media(max-width:700px){html main{padding:14px 12px}html .wrap>.layout>.left{float:none!important;width:100%!important;max-width:none}html .wrap>.layout>.mid{margin:14px 0 0!important}html .hero-card{width:98%;margin:0 1% 16px}html .search-row label,html .search-row label:first-child{display:block;width:100%;margin:0 0 12px}html .amount{width:47%}}

html .tabs{display:block;white-space:normal;font-size:0}html .tabs button{display:inline-block;width:25%;margin:0;padding:15px 5px;font-size:14px;line-height:1.4;text-align:center;color:#315e7b;vertical-align:top}html .tabs button.active{background:#3388bd;color:#fff}
