@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
@font-face{font-family:BreeSerif;src:url(../../assets/font/BreeSerif.otf)}

/* CSS Variables - Light Mode */
:root{--primary-color:#6366f1;--primary-dark:#4f46e5;--primary-light:#8b5cf6;--secondary-color:#10b981;--secondary-dark:#059669;--accent-color:#f59e0b;--accent-dark:#d97706;--background-primary:#ffffff;--background-secondary:#f8fafc;--background-card:#f1f5f9;--background-disabled:#eee;--background-glass:rgba(248,250,252,0.9);--text-primary:#1e293b;--text-secondary:#475569;--text-muted:#64748b;--border-color:#e2e8f0;--border-light:#cbd5e1;--shadow-sm:0 1px 2px 0 rgba(0,0,0,0.05);--shadow-md:0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);--shadow-lg:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);--shadow-xl:0 20px 25px -5px rgba(0,0,0,0.1),0 10px 10px -5px rgba(0,0,0,0.04);--transition-fast:150ms cubic-bezier(0.4,0,0.2,1);--transition-medium:300ms cubic-bezier(0.4,0,0.2,1);--transition-slow:500ms cubic-bezier(0.4,0,0.2,1)}

/* Base Styles */
h1,h2,h3,h4{font-family:'BreeSerif',serif;color:var(--text-primary);font-weight:600}
*{margin:0;padding:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;font-smooth:always;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{width:100%;font-family:'Inter',sans-serif!important;color:var(--text-primary);background:url(/assets/img/bg.jpg);background-position:top center;background-repeat:no-repeat;line-height:1.6}
a,img{color:var(--primary-color);text-decoration:none;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);-o-transition:all var(--transition-medium);transition:all var(--transition-medium)}
a:hover{color:var(--primary-light);text-decoration:none;cursor:pointer}
input,textarea,select,option,div,button{font-family:'Inter',sans-serif;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);transition:all var(--transition-medium);border:0}
p{line-height:1.6;color:var(--text-secondary)}
.container{margin:0 auto;padding:0;width:1200px;position:relative;clear:both}
.label-message{display:none;margin:20px auto none;text-align:center}

/* Modern Navigation */
nav#menu{width:100%;height:auto;padding:0;background:rgba(255,255,255,0.01);backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);text-align:center;position:sticky;top:0;z-index:90;box-shadow:0 4px 32px rgba(0,0,0,0.06);transition:all var(--transition-medium)}
nav#menu.scrolled{background:rgba(255,255,255,0.02);box-shadow:0 6px 40px rgba(0,0,0,0.12);backdrop-filter:blur(30px)}
nav#menu:after{display:none}
nav#menu:hover:after{display:none}
nav#menu ul{list-style:none;padding:0;margin:0;display:flex;justify-content:center;align-items:center;max-width:1200px;margin:0 auto;position:relative;width:100%}
nav#menu ul li{display:flex;position:relative}
nav#menu a{color:var(--text-primary);font-size:15px;font-weight:500;text-transform:none;display:flex;align-items:center;justify-content:center;letter-spacing:0.02em;transition:all var(--transition-medium);position:relative}
nav#menu a:hover{color:var(--primary-color);text-decoration:none}
nav#menu > ul > li:after{display:none}
nav#menu:hover > ul > li:after{display:none}
nav#menu > ul > li > a{text-align:center;padding:22px 35px;font-family:'BreeSerif',serif;color:#fff;font-size:18px;font-weight:600;border-radius:0;transition:all var(--transition-medium);position:relative;min-height:64px;display:flex;align-items:center;justify-content:center;overflow:hidden}
nav#menu > ul > li > a:before{content:'';position:absolute;bottom:0;left:50%;width:0;height:3px;background:linear-gradient(90deg,var(--primary-color),var(--primary-light));transform:translateX(-50%);transition:all var(--transition-medium);border-radius:2px 2px 0 0;box-shadow:0 0 8px rgba(99,102,241,0.3)}
nav#menu > ul > li > a:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(99,102,241,0.05),rgba(139,92,246,0.05));opacity:0;transition:opacity var(--transition-medium)}
nav#menu > ul > li > a:hover{background:rgba(99,102,241,0.08);color:#fff;text-shadow:2px 2px 3px rgba(0, 0, 0, 0.5), 0 0 10px #fff;transform:translateY(-2px);box-shadow:0 8px 25px rgba(99,102,241,0.15)}
nav#menu > ul > li > a:hover:before{width:90%}
nav#menu > ul > li > a:hover:after{opacity:1}
nav#menu > ul > li > a.active{color:var(--primary-color);background:rgba(99,102,241,0.1)}
nav#menu > ul > li > a.active:before{width:100%;height:4px;box-shadow:0 0 12px rgba(99,102,241,0.5)}
nav#menu > ul > li > ul{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(-10px);width:260px;overflow:hidden;max-height:0;opacity:0;visibility:hidden;transition:all var(--transition-medium);background:var(--background-primary);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,0.12);border:1px solid var(--border-color);margin-top:8px;backdrop-filter:blur(10px)}
nav#menu > ul > li > ul:before{content:'';position:absolute;top:-6px;left:50%;transform:translateX(-50%);width:12px;height:12px;background:var(--background-primary);border:1px solid var(--border-color);border-bottom:none;border-right:none;transform:translateX(-50%) rotate(45deg);z-index:-1}
nav#menu > ul > li:hover > ul{padding:20px 0;max-height:400px;opacity:1;visibility:visible;transform:translateX(-50%) translateY(0px)}
nav#menu > ul > li > ul > li{transform:translateY(10px);opacity:0;transition:all var(--transition-medium)}
nav#menu > ul > li:hover > ul > li{transform:translateY(0);opacity:1}
nav#menu > ul > li:hover > ul > li:nth-child(1){transition-delay:50ms}
nav#menu > ul > li:hover > ul > li:nth-child(2){transition-delay:100ms}
nav#menu > ul > li:hover > ul > li:nth-child(3){transition-delay:150ms}
nav#menu > ul > li:hover > ul > li:nth-child(4){transition-delay:200ms}
nav#menu > ul > li > ul > li > a{padding:14px 24px;font-weight:400;font-size:14px;border-radius:8px;color:var(--text-secondary);min-height:auto;transition:all var(--transition-fast);position:relative;margin:0 8px;overflow:hidden}
nav#menu > ul > li > ul > li > a:before{content:'';position:absolute;left:0;top:0;width:3px;height:100%;background:linear-gradient(to bottom,var(--primary-color),var(--primary-light));transform:scaleY(0);transition:transform var(--transition-fast);transform-origin:bottom}
nav#menu > ul > li > ul > li > a:hover{background:rgba(99,102,241,0.08);color:var(--primary-color);padding-left:28px;transform:none;box-shadow:0 4px 12px rgba(99,102,241,0.1)}
nav#menu > ul > li > ul > li > a:hover:before{transform:scaleY(1)}

/* Header */
header{height:350px}
header .logo{text-align:center;padding:0}
header .logo img{width:350px;margin-top:60px}
header.small{height:auto}
header.small .logo{padding:40px 0}
header.small .logo img{max-height:135px}

/* Main Layout */
main{display:inline-block;width:100%}
aside{float:left;width:310px}

/* Enhanced Widgets */
aside .widget,.card{border:1px solid var(--border-color);border-radius:12px;background:var(--background-card);backdrop-filter:blur(10px);position:relative;margin:0 0 20px;box-shadow:var(--shadow-lg);transition:all var(--transition-medium);overflow:hidden}
aside .widget:hover,.card:hover{box-shadow:var(--shadow-xl);border-color:var(--primary-color)}
aside .widget h3,.card--title{background:linear-gradient(135deg,var(--primary-color),var(--primary-dark));text-align:center;font-size:15px;font-weight:700;color:white;padding:12px;text-transform:uppercase;letter-spacing:0.05em}
aside .widget .inner,.card--inner{padding:14px;background:var(--background-card)}
aside .widget ul{list-style:none;margin:0;padding:0}
.card--inner{line-height:1.5}
.card--inner p{padding:5px 0}

/* Enhanced Login Form */
aside #login{border:1px solid var(--border-color);border-radius:12px;background:var(--background-card);backdrop-filter:blur(10px);padding:10px;padding-top:45px;position:relative;margin:0 0 20px;box-shadow:var(--shadow-lg);transition:all var(--transition-medium)}
aside #login:hover{box-shadow:var(--shadow-xl);border-color:var(--primary-color)}
aside #login:before{content:'';position:absolute;background:url(/assets/img/renders/login.png) no-repeat center;background-size:contain;width:211px;height:228px;bottom:85%;bottom:calc(100% - 25px);left:25px;filter:drop-shadow(0 4px 8px rgba(0,0,0,0.3));display:block}
aside #login:after{content:'';position:absolute;background:url(/assets/img/renders/login2.png) no-repeat center;background-size:contain;width:41px;height:18px;top:25px;left:121px;display:block}
aside #login form{padding:10px 0}
aside #login input{background:var(--background-secondary);border:1px solid var(--border-color);color:var(--text-primary);width:100%;height:40px;border-radius:8px;margin:0 0 6px;float:left;outline:0;padding:0 10px;box-shadow:var(--shadow-sm);transition:all var(--transition-medium)}
aside #login input:focus{box-shadow:0 0 0 3px rgba(99,102,241,0.1);border-color:var(--primary-color);background:var(--background-primary)}
aside #login button{font-family:'BreeSerif',serif}
aside #login button.login{background:linear-gradient(135deg,var(--accent-color),var(--accent-dark));border:none;border-radius:8px;width:72px;height:86px;color:#fff;margin:0 0 0 6px;font-size:14px;font-weight:700;text-align:center;text-transform:uppercase;letter-spacing:-.02em;cursor:pointer;box-shadow:var(--shadow-md);transition:all var(--transition-medium)}
aside #login button.login:hover{text-shadow:0 0 10px #fff;box-shadow:var(--shadow-xl);background:linear-gradient(135deg,var(--accent-dark),var(--accent-color))}
aside #login button.login:before{content:'';background:url(/assets/img/renders/signin.png) no-repeat center;background-size:contain;width:43px;height:42px;display:inline-block;vertical-align:top;margin-bottom:5px}
aside #login ::-webkit-input-placeholder{color:var(--text-muted)}
aside #login ::-moz-placeholder{color:var(--text-muted)}
aside #login :-ms-input-placeholder{color:var(--text-muted)}
aside #login :-moz-placeholder{color:var(--text-muted)}
aside #login .account{float:left;max-width:70%;line-height:1;overflow:hidden}
aside #login .account p{color:var(--text-secondary);font-family:'BreeSerif',serif;display:flex;line-height:1.2;flex-direction:column;align-items:flex-start;justify-content:flex-end}
aside #login .account .text{font-size:1em;color:var(--text-muted)}
aside #login .account .user{font-size:1.5em;margin-top:5px;word-wrap:break-word;word-break:break-word;color:var(--primary-color);font-weight:600}

/* Enhanced Functional Buttons */
.button-functional{margin:4px 0;display:flex;flex-wrap:wrap;justify-content:space-between}
.button-functional .item{flex:1;font-family:'BreeSerif',serif;font-size:15px;padding:15px 10px;font-weight:500;color:#fff;border-radius:8px;border:none;display:inline-flex;flex:0 0 calc(50% - 3px);vertical-align:top;cursor:pointer;justify-content:space-evenly;align-items:center;transition:all var(--transition-medium);box-shadow:var(--shadow-md);text-decoration:none}
.button-functional.acc .item{width:135.5px}
.button-functional .item:hover{filter:brightness(120%);box-shadow:var(--shadow-lg)}
.button-functional .item.orange{background:linear-gradient(135deg,var(--accent-color),var(--accent-dark))}
.button-functional .item.green{background:linear-gradient(175deg,var(--secondary-color),var(--secondary-dark))}
.button-functional .item.blue{background:linear-gradient(135deg,var(--primary-color),var(--primary-dark))}
.button-functional .item.darkgray{background:linear-gradient(135deg,#374151,#1f2937)}

/* Account Page Buttons */
.button-functional-account{margin:-2.5px;height:100%;display:flex;flex-wrap:wrap}
.button-functional-account .item{width:22%;font-size:15px;padding:12px 10px 10px;font-weight:400;color:#fff;border-radius:8px;border:none;display:inline-flex;vertical-align:top;cursor:pointer;margin:5px 2.5px;justify-content:center;align-items:center;align-items:flex-start;font-family:'BreeSerif',serif;transition:all var(--transition-medium);box-shadow:var(--shadow-md);text-decoration:none}
.button-functional-account .item:hover{filter:brightness(110%);box-shadow:var(--shadow-lg)}
.button-functional-account .item img{margin:0 10px}
.button-functional-account .item.green{background:linear-gradient(135deg,#f56200,#fa5300)}
.button-functional-account .item.gray{background:linear-gradient(135deg,#6c757d,#5a6268)}
.button-functional-account .item.blue{background:linear-gradient(135deg,var(--primary-color),var(--primary-dark))}
.button-functional-account .item.red{background:linear-gradient(135deg,#ef4444,#dc2626)}
.button-functional-account .item.darkgray{background:linear-gradient(135deg,#374151,#225197)}
.button-functional-account .item.steelblue{background:linear-gradient(135deg,#0ea5e9,#0284c7)}
.button-functional-account .item.vividcyan{background:linear-gradient(135deg,#06b6d4,#0891b2)}
.button-functional-account .item.emeraldgreen{background:linear-gradient(135deg,var(--secondary-color),var(--secondary-dark))}

/* Enhanced Footer Styling */
aside #login .footer{width:110%;width:calc(100% + 28px);margin:10px -14px 0;font-size:14px;display:inline-block;vertical-align:top;padding:12px 15px 0;border-top:1px solid var(--border-color)}
aside #login .footer .left{float:left;color:var(--text-muted);font-weight:400}
aside #login .footer .right{float:right;font-weight:700;color:var(--accent-color)}

/* Enhanced Search */
aside .search{position:relative;width:100%;margin:0 0 15px}
aside .search input{width:100%;height:50px;background:var(--background-secondary);border:1px solid var(--border-color);border-radius:25px;font-size:14px;padding:0 50px 2px 20px;outline:0;box-shadow:var(--shadow-sm);color:var(--text-primary);transition:all var(--transition-medium)}
aside .search input:focus{box-shadow:0 0 0 3px rgba(99,102,241,0.1);border-color:var(--primary-color);background:var(--background-primary)}
aside .search button{width:50px;height:50px;background:var(--primary-color);background-image:url(/assets/img/icons.png);background-position:-129px 16px;background-repeat:no-repeat;position:absolute;top:0;right:0;cursor:pointer;border-radius:50%;border:none;transition:all var(--transition-medium)}
aside .search button:hover{background-color:var(--primary-dark);transform:scale(1.05)}

section .search{position:relative;width:50%;margin:0 0 15px}
section .search input{width:100%;height:50px;background:var(--background-secondary);border:1px solid var(--border-color);border-radius:25px;font-size:14px;padding:0 50px 2px 20px;outline:0;box-shadow:var(--shadow-sm);color:var(--text-primary);transition:all var(--transition-medium)}
section .search input:focus{box-shadow:0 0 0 3px rgba(99,102,241,0.1);border-color:var(--primary-color);background:var(--background-primary)}
section .search button{width:50px;height:50px;background:var(--primary-color);background-image:url(/assets/img/icons.png);background-position:-129px 16px;background-repeat:no-repeat;position:absolute;top:0;right:0;cursor:pointer;border-radius:50%;border:none;transition:all var(--transition-medium)}
section .search button:hover{background-color:var(--primary-dark);transform:scale(1.05)}

/* Enhanced List Tags */
main .listtag{width:100%;list-style:none;margin:0;padding:0}
main .listtag li{display:inline-block;vertical-align:top;width:100%;height:40px;font-size:14px;line-height:40px;background:var(--background-secondary);color:var(--text-primary);margin:0 0 4px;border-radius:8px;transition:all var(--transition-medium)}
main .listtag li:hover{background:var(--background-primary)}
main .listtag li a{display:inline-block;background:transparent;width:100%;height:100%;color:var(--text-primary);padding:0 12px;display:flex;align-items:center}
main .listtag li .tag{width:34px;max-width:32px;height:32px;background:var(--primary-color);display:inline-flex;vertical-align:top;margin:0 12px 0 0;text-align:center;font-size:10px;text-transform:uppercase;color:#fff;letter-spacing:-.02em;position:relative;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);transition:all var(--transition-medium);border-radius:6px;align-items:center;justify-content:center;font-weight:600}
main .listtag li .tag:after{display:none}
main .listtag li .tag.green,main .listtag li .tag.green:after{background:var(--secondary-color)}
main .listtag li .tag.red,main .listtag li .tag.red:after{background:#983030}
main .listtag li .tag.grey,main .listtag li .tag.grey:after{background:#545454}
main .listtag li .tag.orange,main .listtag li .tag.orange:after{background:var(--accent-color)}
main .listtag li .tag.emerald,main .listtag li .tag.emerald:after{background:#857037}
main .listtag li .tag.platinum,main .listtag li .tag.platinum:after{background:#c38e00}
main .listtag li .tag.gold,main .listtag li .tag.gold:after{background:var(--accent-color)}
main .listtag li .tag.bronze,main .listtag li .tag.bronze:after{background:#b7a46f}
main .listtag li .tag.iron,main .listtag li .tag.iron:after{background:#c3bba4}
main .listtag li a:hover{color:var(--primary-color)}
main .listtag li a:hover .tag{max-width:36px;transform:scale(1.1)}
main .listtag li .tag.big{width:66px;max-width:62px;height:32px;line-height:32px;margin:4px 10px 4px 4px}
main .listtag li a:hover .tag.big{max-width:66px}
main .listtag.small li{height:35px;line-height:35px;color:var(--text-muted)}
main .listtag.small li .tag{width:26px;max-width:22px;height:20px;line-height:20px;margin:8px 5px 5px 5px}
main .listtag li.gold{color:var(--accent-color)}
main .listtag li.plate{color:#64748b}
main .listtag li.bronze{color:#a3a3a3}
main .listtag li.head{background:transparent;font-size:14px;color:var(--text-muted);font-weight:700;margin:0;text-transform:uppercase}
main .listtag li.head .tag{background:transparent}
main .listtag li .right{float:right;padding:0 8px;margin-left:auto}
main .listtag .icon-trophy{width:13px;height:20px;display:inline-block;background-image:url(/assets/img/icons.png);background-repeat:no-repeat;background-position:-204px 2px}
main .listtag.inline li{width:auto;min-width:260px;margin:0 10px 10px 0}
main .listtag.inline li a{padding-right:15px}

/* Enhanced Filter */
aside .filter{font-size:0;margin:0 0 6px}
aside .filter select{width:50%;height:40px;display:inline-block;border:1px solid var(--border-color);padding:0 12px;font-size:13px;color:var(--text-primary);outline:0;background:var(--background-secondary);background-image:url(/assets/img/select.png);background-repeat:no-repeat;background-position:center right;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:all var(--transition-medium)}
aside .filter select:first-child{border-radius:20px 0 0 20px}
aside .filter select:last-child{border-radius:0 20px 20px 0}
aside .filter select:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(99,102,241,0.1)}

/* Main Section */
main section{width:870px;float:right}

/* Enhanced Main Boxes */
main .box{width:100%;border:1px solid var(--border-color);border-radius:12px;background:var(--background-card);backdrop-filter:blur(10px);position:relative;margin:0 0 30px;box-shadow:var(--shadow-lg);display:inline-block;vertical-align:top;transition:all var(--transition-medium)}
main .box:hover{box-shadow:var(--shadow-xl);border-color:var(--primary-color)}
main .box.mid{max-width:570px}
main section .box.guia{margin-top:36px;overflow:visible}
main section .box.guia > .title-new{font-size:18px;color:var(--primary-color);font-weight:700;text-transform:uppercase;display:inline-block;vertical-align:top;margin:-50px 0 0 15px;background:var(--background-card);padding:15px 20px 15px 90px;border-radius:12px;border:1px solid var(--border-color);box-shadow:var(--shadow-md);position:relative;overflow:visible}
main section .box.guia > .title-new:before{content:'';width:70px;height:65px;background-image:url(/assets/img/renders/02.png);background-repeat:no-repeat;background-position:center;background-size:cover;display:block;position:absolute;top:50%;left:10px;transform:translateY(-50%);filter:drop-shadow(0 4px 8px rgba(0,0,0,0.3));z-index:1}
main section .box.guia > .title-new span{position:relative;z-index:2}
main section .box .biglist{padding:15px 30px 20px;margin:0;list-style:none}
main section .box .biglist li{display:inline-block;width:100%;background:var(--background-secondary);border-radius:12px;margin:0 0 20px;padding:0 40px 0 0;border:1px solid var(--border-color);transition:all var(--transition-medium)}
main section .box .biglist li:hover{background:var(--background-primary);box-shadow:var(--shadow-md)}
main section .box .biglist li i[class*="icon"]{width:100px;height:100px;background:#f28a1a;background-image:url(/assets/img/icons.png);background-repeat:no-repeat;float:left;border-radius:50%;margin:0 16px 0 0}
main section .box .biglist li i.icon-controls{background-position:0 -34px}
main section .box .biglist li i.icon-fight-lab{background-position:-100px -30px}
main section .box .biglist li i.icon-school{background-position:-200px -32px}
main section .box .biglist li i.icon-consortia{background-position:-300px -34px}
main section .box .biglist li strong{font-size:15px;color:var(--accent-color);font-weight:700;text-transform:uppercase;margin:17px 0 5px;display:inline-block}
main section .box .biglist li p{font-size:16px;color:var(--text-secondary);line-height:140%}
main section .box .biglist .recharge-left,main section .box .biglist .recharge-right{width:50%;float:left;padding:0 15px;box-sizing:border-box}
main section .box.itens{margin-top:36px;overflow:visible}
main section .box.itens > .title-new{font-size:18px;color:var(--secondary-color);font-weight:700;text-transform:uppercase;display:inline-block;vertical-align:top;margin:-50px 0 0 15px;background:var(--background-card);padding:12px 20px 12px 75px;border-radius:12px;border:1px solid var(--border-color);box-shadow:var(--shadow-md);position:relative;overflow:visible}
main section .box.itens > .title-new:before{content:'';width:60px;height:62px;background-image:url(/assets/img/renders/03.png);background-repeat:no-repeat;background-position:center;background-size:cover;display:block;position:absolute;top:50%;left:8px;transform:translateY(-50%);filter:drop-shadow(0 4px 8px rgba(0,0,0,0.3));z-index:1}
main section .box.itens > .title-new span{position:relative;z-index:2}
main section .box.register{margin-top:36px;overflow:visible}
main section .box.register > .title-new{font-size:18px;color:var(--secondary-color);font-weight:700;text-transform:uppercase;display:inline-block;vertical-align:top;margin:-37px 0 0 15px;background:var(--background-card);padding:12px 20px 12px 70px;border-radius:12px;border:1px solid var(--border-color);box-shadow:var(--shadow-md);position:relative;overflow:visible}
main section .box.register > .title-new:before{content:'';width:60px;height:62px;background-image:url(/assets/img/renders/05.gif);background-repeat:no-repeat;background-position:center;background-size:cover;display:block;position:absolute;top:50%;left:8px;transform:translateY(-50%);filter:drop-shadow(0 4px 8px rgba(0,0,0,0.3));z-index:1}
main section .box.register > .title-new span{position:relative;z-index:2}

/* Enhanced Item List */
main .listsquare{width:100%;list-style:none;padding:0;margin:0;font-size:0;vertical-align:top;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));padding:20px}
main .listsquare li{background:var(--background-secondary);border:1px solid var(--border-color);border-radius:8px;padding:10px;margin:0 10px 10px 0;text-align:center;transition:all var(--transition-medium);aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center}
main .listsquare li:hover{background:var(--background-primary);border-color:var(--primary-color);transform:translateY(-4px);box-shadow:var(--shadow-md)}
main .listsquare li img{vertical-align:top;max-height:68px;margin:5px;max-width:100%;object-fit:contain}
main .listsquare li span{width:100%;font-size:12px;color:var(--accent-color);display:inline-block;vertical-align:top;margin:2px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}

/* Enhanced Slide Home */
main #slideHome{width:620px;height:260px;border:1px solid var(--border-color);background:var(--background-secondary);box-shadow:var(--shadow-lg);border-radius:12px;overflow:hidden;float:left;margin:0 0 40px}
main #slideHomeAnchor{width:250px;float:right;margin:0 0 40px}
main #slideHomeAnchor .item{width:100%;height:48px;font-size:12px;text-transform:uppercase;line-height:48px;margin:0 0 5px;border-radius:8px;overflow:hidden;transition:all var(--transition-medium)}
main #slideHomeAnchor .item:last-child{margin:0}
main #slideHomeAnchor .item a{display:inline-block;color:var(--text-muted);width:100%;height:100%;padding:0 16px;background:var(--background-secondary);border:1px solid var(--border-color);border-radius:8px;transition:all var(--transition-medium)}
main #slideHomeAnchor .item.active a,main #slideHomeAnchor .item a:hover{background:linear-gradient(135deg,var(--accent-color),var(--accent-dark));color:#fff;transform:translateX(4px);box-shadow:var(--shadow-md)}

/* Enhanced News Tabs */
.newsTabsAnchor{width:100%;height:45px;background:linear-gradient(135deg,var(--accent-color),var(--accent-dark));border-radius:12px 12px 0 0;padding:6px;box-shadow:var(--shadow-md)}
.newsTabsAnchor a{color:#FFF;padding:0 15px;line-height:33px;font-size:13px;font-weight:600;display:inline-block;position:relative;border-radius:8px;flex:1;text-align:center;text-decoration:none;cursor:pointer}
.newsTabsAnchor a:hover{background:rgba(255,255,255,0.1);color:#FFF;text-decoration:none}
.newsTabsAnchor a.active{background:#fff;color:var(--accent-color);font-weight:700;box-shadow:var(--shadow-sm)}
.newsTabsAnchor a:after{display:none}

/* Enhanced Item Tabs */
.itemTabsAnchor{background:transparent;float:right;width:auto;margin:-32px 0 0;text-transform:none;font-family:'BreeSerif',serif;display:flex;position:relative;z-index:5}
.itemTabsAnchor a{background:transparent;color:#f5f5f5;padding:8px 12px;line-height:15px;font-size:15px;font-weight:400;border-right:1px solid var(--border-color);display:inline-block;position:relative;text-decoration:none;cursor:pointer;outline:none}
.itemTabsAnchor a:last-child{border-right:0}
.itemTabsAnchor a:hover{color:#fff;text-decoration:none}
.itemTabsAnchor a.active{color:#fff;font-weight:500}
.itemTabsAnchor a.active:after{content:'';width:0;height:0;background:transparent;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid var(--primary-color);left:50%;transform:translateX(-50%);bottom:-9px;position:absolute;display:block}

/* Enhanced Tabs Content */
main section .tabsContent > div{width:100%;padding:20px 15px 0;display:none;vertical-align:top}
main section .tabsContent > div.active{display:inline-block}
main section .tabsContent a.seeall{width:105.6%;width:calc(100% + 30px);margin:15px -15px 0;color:var(--text-muted);font-size:13px;display:inline-block;padding:12px;text-align:center;border-top:1px solid var(--border-color);transition:all var(--transition-medium)}
main section .tabsContent a.seeall:hover{background:var(--background-secondary);color:var(--primary-color)}
main section .cards{float:right;width:280px;text-align:right}
main section .cards a{display:inline-block;vertical-align:top;width:100%;margin:-5px 0 10px;border-radius:8px;overflow:hidden;transition:all var(--transition-medium)}
main section .cards a:hover img{-webkit-filter:brightness(120%);filter:brightness(120%)}

/* Enhanced Footer */
footer{width:100%;height:auto;text-align:center;position:relative}
footer.servers{background:transparent;height:auto}
footer .text{font-size:20px;font-weight:700;color:var(--primary-color);margin:40px 0;display:inline-block;width:100%;text-align:center;font-family:'BreeSerif',serif;text-shadow:#fff 0 0 30px,#fff 0 0 10px,#fff 0 0 10px,#fff 0 0 10px,#fff 0 0 1px,#fff 0 0 1px}
footer.servers .text{color:var(--text-primary);margin:50px 0;font-size:16px}
footer .bottom{width:100%;height:40px;line-height:40px;font-size:12px;color:var(--text-muted);position:absolute;bottom:0;left:0;background:var(--background-secondary)}
footer .bottom a{color:var(--text-muted)}
footer .bottom a:hover{color:var(--primary-color)}
footer .bottom ul{list-style:none;margin:0;padding:0}
footer .bottom ul li{display:inline-block;margin:0}
footer .bottom ul li:after{content:'|';margin:0 8px;display:inline-block}
footer .bottom ul li:last-child:after{display:none}
footer .bottom .left{float:left}
footer .bottom .right{float:right}

/* Enhanced Banner */
main .banner{border:1px solid var(--border-color);background:var(--background-secondary);box-shadow:var(--shadow-lg);border-radius:12px;overflow:hidden;float:left;margin:0 0 30px}
main .banner img{vertical-align:top}

/* Enhanced Box Single */
main .box.single{padding:30px;background-color:var(--background-card);word-break:break-word}
main .box.list.pay{padding:30px}
main .box.single .share{width:60px;float:left;padding:0 30px 0 0}
main .box.single .date{width:100%;text-align:center;color:var(--text-muted);line-height:10px;padding:5px 0 20px}
main .box.single .date .d{font-size:18px;font-weight:800}
main .box.single .date .m{font-size:12px;text-transform:uppercase;margin:6px 0 0;display:inline-block}
main .box.single .date .y{font-size:10px}
main .box.single .share a{width:30px;height:30px;border-radius:3px;display:inline-block;vertical-align:top;margin:0 0 5px;background-color:#000;background-image:url(/assets/img/icons.png);background-repeat:no-repeat}
main .box.single .share a[href*="facebook"]{background-color:#3b5998;background-position:-269px 9px}
main .box.single .share a[href*="whatsapp"]{background-color:#0dc342;background-position:-306px 10px}
main .box.single .share a[href*="twitter"]{background-color:#20a2f2;background-position:-342px 10px}
main .box.single .share a[href*="pinterest"]{background-color:#be0f23;background-position:-379px 10px}
main .box.single .share a:hover{-webkit-filter:brightness(120%);filter:brightness(120%)}
main .box.single .content{float:left;width:calc(100% - 60px);border-left:1px solid var(--border-color);padding:0 0 0 30px}
main .box.single .content .title{font-size:16px;font-weight:900;color:var(--accent-color);text-transform:uppercase;margin:0 0 20px}
main .box.single .content p,main .box.single .content ul{color:var(--text-secondary);font-size:15px;margin:0 0 15px;list-style:none;line-height:150%}

/* Enhanced Box List */
main .box.list ul{list-style:none;margin:0;padding:0}
main .box.list ul li{border-bottom:1px solid var(--border-color)}
main .box.list ul li.title{color:#fff;background:var(--accent-color);padding:15px 24px;font-size:18px;text-transform:uppercase}
main .box.list ul li a{width:100%;display:inline-block;padding:15px 24px}
main .box.list ul li a span{color:var(--text-muted);margin:0 30px 0 0}
main .box.list ul li a:hover{background:var(--background-secondary)}
main .box.list ul li:last-child{border-bottom:0}
#master-qr-info{display:none}
main .box.list.pagenavi ul li{width:auto;border-right:1px solid var(--border-color);border-bottom:0;display:inline-block}
main .box.list.pagenavi ul li a{height:50px;line-height:50px;vertical-align:top;padding:0 20px}
main .box.list.pagenavi ul li a.small{font-size:13px}
main .box.servers{width:100%;min-height:520px;padding:10px 20px;border:1px solid var(--border-color)}
main .box.servers aside #login{background:transparent;border:0;box-shadow:none}
main .box.servers aside #login .footer{width:100%;margin:10px 0 0;padding:10px 0}
main .box.servers .content{max-width:calc(100% - 300px);float:left;padding:10px 0 0 15px}
main .box.servers .content .title{font-size:16px;font-weight:900;color:var(--primary-color);text-transform:uppercase;margin:0 0 15px}
main .box.servers .listtag{margin-bottom:45px}

/* Enhanced Top Button */
#toTop{position:fixed;bottom:15px;right:15px;background:var(--background-card);width:35px;height:35px;z-index:9090;border-radius:50%;text-align:center;cursor:pointer;transform:translateY(200%);-o-transform:translateY(200%);-ms-transform:translateY(200%);-moz-transform:translateY(200%);-webkit-transform:translateY(200%);-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);-o-transition:all var(--transition-medium);transition:all var(--transition-medium);box-shadow:var(--shadow-lg);border:1px solid var(--border-color)}
#toTop.show{transform:translateY(0%);-o-transform:translateY(0%);-ms-transform:translateY(0%);-moz-transform:translateY(0%);-webkit-transform:translateY(0%)}
#toTop:hover{background:var(--primary-color)}
#toTop:before{content:'';width:7px;height:7px;border-right:5px solid var(--text-primary);border-top:5px solid var(--text-primary);display:inline-block;margin:14px 0 0;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);position:relative}

/* Enhanced Render Elements */
.render01{width:91px;height:84px;background-image:url(/assets/img/renders/01.png);background-repeat:no-repeat;background-position:center;position:absolute;top:-16px;right:-26px}
.render02{width:319px;height:228px;background-image:url(/assets/img/renders/04.png);background-repeat:no-repeat;background-position:center;position:absolute;top:-165px;right:-100px}
.render03{width:200px;height:208px;background-image:url(/assets/img/renders/05.png);background-repeat:no-repeat;background-position:center;position:absolute;bottom:-15px;left:-65px}

/* Enhanced Modal */
div.modal{width:100%;height:100%;background:rgba(0,0,0,0.6);position:fixed;top:0;left:0;z-index:99999;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-webkit-filter:opacity(0%);filter:opacity(0%);visibility:hidden;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);-o-transition:all var(--transition-medium);transition:all var(--transition-medium)}
div.modal.open{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-filter:opacity(100%);filter:opacity(100%);visibility:visible}
div.modal .content{position:absolute;top:50%;left:50%;width:500px;max-height:80vh;height:auto;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:20}
div.modal .content .title{width:100%;text-align:center;font-size:20px;font-weight:900;color:var(--text-primary);margin:0 0 4px}
div.modal .box{width:100%;border:1px solid var(--border-color);border-radius:15px;background:var(--background-card);position:relative;margin:0 0 30px;box-shadow:var(--shadow-xl);display:inline-block;vertical-align:top;padding:32px;text-align:center}
div.modal .box p{font-size:20px;color:var(--text-secondary);max-width:340px;margin:15px auto}
div.modal .box .button{background:linear-gradient(135deg,var(--accent-color),var(--accent-dark));border:none;border-radius:80px;width:200px;height:58px;line-height:54px;color:#fff;margin:0 0 0 6px;font-size:16px;font-weight:900;text-align:center;text-transform:uppercase;display:inline-block;letter-spacing:-.01em;cursor:pointer;transition:all var(--transition-medium);box-shadow:var(--shadow-md)}
div.modal .box .button:hover{text-shadow:0 0 10px #fff;border-color:var(--border-color)}
div.modal .box .button .icon{background-image:url(/assets/img/renders/signin.png);background-position:center;background-repeat:no-repeat;background-size:contain;width:26px;height:26px;display:inline-block;vertical-align:middle;margin:-4px 5px 0 0}
div.modal .box .cancel{font-size:12px;color:var(--text-muted);text-transform:uppercase;margin:12px 0 0;display:inline-block}
div.modal > .close{width:100%;height:100%;position:absolute;top:0;left:0;z-index:1}
div.modal > .close span{position:absolute;top:20px;right:36px;background:var(--accent-color);cursor:pointer;-webkit-filter:opacity(80%);filter:opacity(80%);-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);transition:all var(--transition-medium)}
div.modal > .close span:before,div.modal > .close span:after{content:'';width:5px;height:25px;background:#fff;position:absolute;top:0;left:0;border-radius:10px;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);display:block}
div.modal > .close span:after{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);display:block}
div.modal > .close span:hover{-webkit-filter:opacity(100%);filter:opacity(100%)}

/* Enhanced Forms */
form.detail-account{width:100%;display:inline-block}
form.detail-account label{width:100%;display:inline-block;text-align:left;margin:0 0 14px;font-size:15px;font-weight:600;color:var(--text-primary)}
form.detail-account label span{display:inline-block}
form.detail-account input{width:100%;height:30px;background:var(--background-secondary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:5px;padding:0 25px;box-shadow:var(--shadow-sm)}
form.detail-account .info{width:25%}
form.detail-account button{cursor:pointer;font-family:'BreeSerif',serif}
form.detail-account .button .icon{background-image:url(/assets/img/renders/signin.png);background-position:center;background-repeat:no-repeat;background-size:contain;width:20px;height:21px;display:inline-block;vertical-align:middle}
form.detail-account input:focus{outline:0}
form.detail-account ::-webkit-input-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}
form.detail-account ::-moz-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}
form.detail-account :-ms-input-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}
form.detail-account :-moz-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}
form.account{width:100%;display:inline-block}
form.account label{width:100%;display:inline-block;text-align:left;margin:0 0 14px;font-size:15px;font-weight:600;color:var(--text-primary)}
form.account label span{margin:0 0 5px;display:inline-block}
form.account input,form.account select{width:100%;height:40px;background:var(--background-primary);font-size:14px;color:var(--text-primary);border:1px solid var(--border-color);border-radius:5px;padding:0 10px;box-shadow:var(--shadow-sm)}
form.account input:disabled{background:var(--background-disabled)!important;border:1px solid #e5e5e5;cursor:not-allowed}
form.account input[type=number]::-webkit-outer-spin-button,form.account input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
form.account input[type=number]{-moz-appearance:textfield}
form.account .input-button-group{display:flex}
form.account .input-button-group input{flex:1}
form.account .input-button-group button{height:40px;font-size:14px;padding:0 15px;margin-left:5px;background:var(--primary-color);color:#fff;border-radius:5px;cursor:pointer;box-shadow:var(--shadow-sm)}
form.account .button{margin-bottom:20px;background:linear-gradient(to bottom,var(--accent-color) 0%,var(--accent-dark) 100%);border-radius:5px;width:150px;height:45px;line-height:47px;color:#fff;font-size:15px;font-weight:500;text-align:center;text-transform:uppercase;display:inline-block;letter-spacing:-.01em;cursor:pointer;font-family:'BreeSerif',serif}
form.account .button:hover{text-shadow:0 0 10px #fff;border-color:var(--border-color)}
form.account .button .icon{background-image:url(/assets/img/renders/signin.png);background-position:center;background-repeat:no-repeat;background-size:contain;width:20px;height:21px;display:inline-block;vertical-align:middle}
form.account input:focus{outline:0;box-shadow:0 0 0 1px rgba(99,102,241,0.3)}
form.account ::-webkit-input-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}
form.account ::-moz-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}
form.account :-ms-input-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}
form.account :-moz-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}
.item-group{display:flex;align-items:baseline;justify-content:center}
.item-group a{flex:1;font-weight:500}
.item-group button{margin-right:20px}
div.modal .box .buttonsSocial .social{width:calc(50% - 5px);text-align:left}
div.modal .box .buttonsSocial .social .icon{width:50px}
div.modal .or{width:100%;color:var(--text-muted);font-size:12px;position:relative;margin:12px 0;display:inline-block}
div.modal .or:after{content:'';width:100%;height:1px;background:var(--border-color);position:absolute;top:50%;left:0;z-index:1;display:block}
div.modal .or span{background:var(--background-card);padding:0 10px;display:inline-block;position:relative;z-index:2}
.popup-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}
.popup-overlay.active{display:block;opacity:1;visibility:visible}
.popup-content{background:#fff;padding:20px;width:500px;margin:100px auto;border-radius:8px;position:relative;box-shadow:0 4px 10px rgba(0,0,0,0.3);transform:translateY(-20px);transition:transform .3s ease}
.popup-overlay.active .popup-content{transform:translateY(0)}
.popup-content table{width:100%;border-collapse:separate;border-spacing:0;margin-top:15px;font-size:14px;background:#fff;border-radius:6px;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,0.05)}
.popup-content th{padding:12px 16px;text-align:center;font-weight:600;font-size:15px;color:#fff;border-bottom:1px solid var(--border-color);background:var(--primary-color)}
.popup-content td{padding:12px 16px;text-align:center;color:#444;border-bottom:1px solid var(--border-color);border-right:1px solid var(--border-color);transition:background-color .2s ease}
.popup-content td:last-child{border-right:0}
.popup-content tbody tr:hover{background:var(--background-secondary)}
.popup-content b{font-weight:600}
.close-popup{position:absolute;top:10px;right:15px;font-size:20px;cursor:pointer;color:#333;transition:color .3s ease}
.close-popup:hover{color:#000}

/* Enhanced Check-in Table */
.checkin.table-responsive{overflow-x:auto;width:100%}
.checkin.table{width:100%;border-collapse:collapse;font-size:14px;background-color:var(--background-primary);box-shadow:var(--shadow-sm);border-radius:8px;overflow:hidden}
.checkin.table thead{background-color:var(--primary-light)}
.checkin.table thead th{padding:12px 16px;text-align:left;vertical-align:middle;font-weight:600;color:#fff;border-bottom:1px solid var(--border-color);background-color:var(--primary-light)}
.checkin.table tbody td{padding:7px 16px;vertical-align:middle;border-top:1px solid var(--border-light);color:var(--text-secondary)}
.checkin.table tbody tr:hover{background-color:var(--background-card);transition:background-color var(--transition-fast)}
.checkin.table td img{width:32px;height:32px;margin-right:10px;vertical-align:middle}
.checkin.table td span{vertical-align:middle;display:inline-block;color:var(--text-primary)}

/* Enhanced Content Tables */
.content table{margin:10px auto;border-collapse:collapse}
.content table tr:nth-child(odd){background:var(--background-secondary)}
.content table tr:nth-child(even){background:var(--background-card)}
.content table td,.content table th{border:1px solid var(--border-color);padding:3px 10px}
.content table th{color:#fff;font-weight:bolder;padding:5px 10px;background:var(--primary-color);text-align:center}

/* Enhanced Box Styles */
.box{width:100%;border:1px solid var(--border-color);border-radius:12px;background:var(--background-card);position:relative;margin:0 0 30px;box-shadow:var(--shadow-lg);display:inline-block;vertical-align:top}
.box.pay{width:100%;min-height:520px;padding:10px 20px;border:1px solid var(--border-color);margin-top:55px}
.box.pay .content{width:100%;float:right;padding:10px}
.box.pay .content .title{font-size:16px;font-weight:900;color:var(--primary-color);text-transform:uppercase;margin:0 0 12px}

/* Enhanced Loading */
#loading{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--background-glass);z-index:50;border-radius:8px;display:none}
#loading i{width:44px;height:44px;position:absolute;top:50%;left:50%;background-image:url(/assets/img/icons_pay.png);background-repeat:no-repeat;background-position:-299px -35px;animation:spinLoad 1.2s linear infinite;-o-animation:spinLoad 1.2s linear infinite;-ms-animation:spinLoad 1.2s linear infinite;-moz-animation:spinLoad 1.2s linear infinite;-webkit-animation:spinLoad 1.2s linear infinite}

/* Enhanced Payment Styles */
.stripe-metodos-img{width:145px;height:70px;background-size:contain;background-position:center;background-repeat:no-repeat;float:left;margin-left:.5em}
.selects{font-size:0;margin:0 0 25px}
.selects select{width:300px;max-width:100%;height:40px;display:inline-block;border:1px solid var(--border-color);padding:0 60px 0 22px;margin:0 10px 0 0;font-size:15px;color:var(--text-primary);outline:0;border-radius:5px;background:var(--background-secondary);background-image:url(/assets/img/select.png);background-repeat:no-repeat;background-position:center right;-webkit-appearance:none;-moz-appearance:none;appearance:none}
.form-group{font-size:0;margin:0 0 25px}
.form-group .form-control{width:300px;max-width:100%;height:50px;display:inline-block;border:1px solid var(--border-color);padding:0 60px 0 22px;margin:5px 10px 0 0;font-size:15px;color:var(--text-primary);outline:0;border-radius:60px;background:var(--background-secondary);background-repeat:no-repeat;background-position:center right;-webkit-appearance:none;-moz-appearance:none;appearance:none}
.form-group .captcha{width:180px;max-width:100%;height:50px;display:inline-block;border:1px solid var(--border-color);font-size:15px;color:var(--text-primary);outline:0;border-radius:60px;background:var(--background-secondary);background-repeat:no-repeat;background-position:center right;-webkit-appearance:none;-moz-appearance:none;appearance:none;overflow:hidden}
.selects select[disabled]{-webkit-filter:opacity(40%);filter:opacity(40%);cursor:not-allowed}
.selects select option{color:var(--text-primary)}
.selects select option:disabled{color:var(--text-muted)}

/* Enhanced Tags */
.tags{display:inline-block;position:relative;font-size:0;margin:0 0 15px}
.tags a{min-width:140px;background:var(--background-secondary);border:1px solid var(--border-color);border-radius:10px;padding:10px 15px;display:inline-block;position:relative;margin:0 10px 10px 0;overflow:hidden}
.tags a img{vertical-align:top}
.tags a.selected{border-color:var(--accent-color)}
.tags a.selected:before{content:'';width:22px;height:22px;background-color:var(--accent-color);background-image:url(/assets/img/icons_pay.png);background-repeat:no-repeat;background-position:-249px -44px;background-size:contain;border-radius:100%;position:absolute;top:50%;left:8%;z-index:12;-webkit-transform:translatey(-50%);-moz-transform:translatey(-50%);-ms-transform:translatey(-50%);-o-transform:translatey(-50%);transform:translatey(-50%);display:block}
.tags a.selected:after{content:'';background-color:var(--accent-color);width:100%;height:100%;position:absolute;top:0;left:0;z-index:10;-webkit-filter:opacity(15%);filter:opacity(15%)}
.tags a .value{background:var(--text-muted);font-size:16px;font-weight:700;line-height:30px;color:#fff;width:100%;display:inline-block;border-radius:200px 200px 0 0;margin:-1px 0 0;text-align:center}
.tags a.selected .value{background-color:var(--accent-color)}
.tags a .qnt{font-size:18px;font-weight:700;line-height:14px;color:var(--text-primary);text-align:center;padding:10px 0 8px}
.tags a .qnt span{font-size:13px;font-weight:400;width:100%;display:inline-block}
.tags a.selected .qnt{color:var(--accent-color)}

/* Enhanced Buttons */
.button button{background:linear-gradient(135deg,var(--accent-color),var(--accent-dark));border:none;border-radius:80px;width:200px;height:58px;line-height:54px;color:#fff;margin:-5px 0 20px;font-size:16px;font-weight:900;text-align:center;text-transform:uppercase;display:inline-block;letter-spacing:-.01em;cursor:pointer}
.button button:hover{text-shadow:0 0 10px #fff;border-color:var(--border-color)}
.button{border-radius:80px;width:200px;height:40px;color:#fff;font-size:16px;font-weight:900;text-align:center;text-transform:uppercase;display:inline-block;letter-spacing:-.01em;cursor:pointer}

/* Enhanced Alerts */
.alert{width:100%;padding:14px 16px 16px;background:var(--background-card);color:var(--text-primary);display:inline-block;margin:10px 0}
.alert.alert-error{background:var(--accent-color);border-radius:5px}

/* Enhanced Utility Classes */
.bold{font-weight:700}
.w-50{width:50%}
.w-100{width:100%}
.blocker{z-index:9999!important}
.f-left{float:left}
.f-right{float:right}
.pb-10{padding-bottom:10px}
.pt-10{padding-top:10px}
.text-center{text-align:center}
.text-right{text-align:right}
.d-select-stripe{display:flex}
.stripe-metodo-selected{border:2px solid var(--accent-color)}
.stripe-metodo-selected:before{content:'';width:22px;height:22px;background-color:var(--accent-color);background-image:url(/assets/img/icons_pay.png);background-repeat:no-repeat;background-position:-249px -44px;background-size:contain;border-radius:100%;position:absolute;top:52%;left:159px;z-index:12;-webkit-transform:translatey(-50%);-moz-transform:translatey(-50%);-ms-transform:translatey(-50%);-o-transform:translatey(-50%);transform:translatey(-50%);display:block}
.select{width:347px;max-width:100%;height:50px;display:inline-block;border:1px solid var(--border-color);padding:0 60px 0 22px;margin:0 10px 0 0;font-size:15px;color:var(--text-primary);outline:0;border-radius:60px;background:var(--background-secondary);background-image:url(/assets/img/select.png);background-repeat:no-repeat;background-position:center right;-webkit-appearance:none;-moz-appearance:none;appearance:none}

/* Enhanced Tooltips */
[data-toggle=tooltip]{position:relative}
[data-toggle=tooltip]::before{content:attr(data-title);position:absolute;white-space:nowrap;font-size:13px;line-height:15px;height:15px;font-weight:300;padding:4px 10px;border-radius:50px;top:100%;left:50%;background:var(--background-primary);color:var(--text-primary);-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-filter:opacity(0%);filter:opacity(0%);visibility:hidden;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);-o-transition:all var(--transition-medium);transition:all var(--transition-medium);display:block;z-index:1000}
[data-toggle=tooltip]::after{content:'';position:absolute;top:80%;top:calc(100% - 14px);left:50%;width:0;height:0;border-bottom:6px solid var(--background-primary);border-right:6px solid transparent;border-left:6px solid transparent;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-filter:opacity(0%);filter:opacity(0%);visibility:hidden;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);-o-transition:all var(--transition-medium);transition:all var(--transition-medium);display:block;z-index:1000}
[data-toggle=tooltip]:hover::before{-webkit-filter:opacity(100%) brightness(110%);filter:opacity(100%) brightness(110%);visibility:visible}
[data-toggle=tooltip]:hover::after{-webkit-filter:opacity(100%) brightness(110%);filter:opacity(100%) brightness(110%);visibility:visible}

/* Enhanced Special Elements */
#stripe-methods{display:none}
.box.list .account{background:var(--background-secondary);border-left:5px solid var(--primary-color);position:relative;padding:12px 50px 12px 22px;font-size:16px;color:var(--text-primary);margin:10px 0 20px;display:inline-block}
.error-check{color:var(--accent-color);padding-top:5px}
.game-server-wrapper{color:#fff}
.game-content-wrapper .frame{padding:12px 10px!important}
.game-content-wrapper .frame,.game-content-wrapper .inner-frame{background:var(--background-glass)}
.game-content-wrapper .ddt-game-border{border:1px solid var(--border-color);padding:7px 10px;border-radius:10px;margin-bottom:10px}
.game-wrapper-flex{display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}
.ddt-game-border img{width:auto;height:35px;margin-top:0;margin-right:0}
.switch-button{position:relative;display:table;cursor:pointer;min-width:130px}
.switch-button:hover{padding-left:4px}
.switch-button .game_status{border-radius:50%;border:1px solid #fff;width:15px;height:15px;margin:2px 7px 2px 0;padding:3px}
.switch-button .game_status .status{border-radius:50%;width:100%;height:100%}
.switch-button .game_status .status.s1{background:rgba(255,235,59,1);border-color:rgba(255,235,59,1)}
.switch-button .game_status .status.s2{background:rgba(243,37,41,1);border-color:rgba(243,37,41,1)}
.switch-button .game_status .status.s3{background:rgba(120,120,120,1);border-color:rgba(120,120,120,1)}
.switch-button .game_status .status.s4{background:rgba(22,122,242,1);border-color:rgba(22,122,242,1)}
.game-button{position:relative;display:table;cursor:pointer;min-width:130px}
.game-button-bg{background-color:var(--accent-color)}
.game-button:hover{background-color:var(--secondary-color)}
.game-button a:hover{text-decoration:none!important}
.game-button a{color:#fff}
.game-button .game_status{border-radius:50%;border:1px solid #fff;width:15px;height:15px;margin:2px 7px 2px 0;padding:3px}
.game-button .game_status .status{border-radius:50%;width:100%;height:100%}
.inner-frame{margin:25px auto;padding-bottom:25px!important}
.game-button .game_status .status.s1{background:rgba(255,235,59,1);border-color:rgba(255,235,59,1)}
.game-button .game_status .status.s2{background:rgba(243,37,41,1);border-color:rgba(243,37,41,1)}
.game-button .game_status .status.s3{background:rgba(120,120,120,1);border-color:rgba(120,120,120,1)}
.game-button .game_status .status.s4{background:rgba(22,122,242,1);border-color:rgba(22,122,242,1)}
.top_title{font-size:24px}
.server_font{color:#fffdfb;font-weight:700}
.row{height:130px;margin-right:15px;margin-left:15px;box-sizing:border-box;display:block;clear:both}
.text-center{text-align:center}
.mb-5{margin-bottom:5px}
.mb-10{margin-bottom:10px}
.mb-15{margin-bottom:15px}
.max-wd-150{max-width:150px}
.inner-frame{margin:25px auto;padding-bottom:25px!important}
.text-center{text-align:center}

/* Enhanced Tab System */
.tab{overflow:hidden;border:1px solid var(--border-color);background-color:var(--background-secondary)}
.tab button{background-color:inherit;float:left;border:none;outline:none;cursor:pointer;padding:14px 16px;transition:.3s;font-size:17px}
.tab button:hover{background-color:var(--background-primary)}
.tab button.active{background-color:var(--primary-color)}
.tabcontent{display:none;padding:6px 12px;border-top:none}
.wrapper-captcha > img{display:inline-block;vertical-align:middle}
.list-card-recharge{text-align:center}
.list-card-recharge .title{color:var(--text-primary);font-weight:600;padding:20px 0}
.ratio_deposite{display:none}
.ratio_deposite:focus{box-shadow:none!important}
.select-phoenix{padding:10px;border-radius:5px;border:1px solid var(--border-color);outline:none}

/* Enhanced Overlay */
.overlay{height:100%;width:0;position:fixed;z-index:999;top:0;left:0;background-color:var(--background-primary);background-color:rgba(255,255,255,0.95);overflow-x:hidden;transition:.5s}
.overlay-content{position:relative;top:25%;width:100%;text-align:center;margin-top:30px}
.overlay a{padding:8px;text-decoration:none;font-size:36px;color:var(--text-secondary);display:block;transition:.3s}
.overlay a:hover,.overlay a:focus{color:var(--text-primary)}
.overlay .closebtn{position:absolute;top:20px;right:45px;font-size:60px}
.p-relative{position:relative}
.hint-text{position:absolute;left:50%;top:0;display:none;width:200px;transform:translateY(-100%) translateX(-50%);background-color:var(--background-primary);color:var(--text-primary);padding:10px;border-radius:5px}
.compete-item:hover+.hint-text{display:block}

.d-none{display:none!important}
.header-banner{width:611px}
.header-banner img{width:100%}
.card-launcher{width:250px;cursor:pointer}
.card-launcher a img{width:100%}

.row-coin{display:flex}
.row-coin label{flex:1}
.row-coin label:first-child{margin-right:10px}
.row-coin input{width:100%;box-sizing:border-box}

/* Enhanced Confirm Convert Coin */
#confirm-convert{display:none;position:fixed;z-index:9999;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgba(0,0,0,0.6)}
#confirm-convert .modal-content{background-color:var(--background-card);margin:15% auto;padding:20px;border:1px solid var(--border-color);width:500px;border-radius:12px}
#confirm-convert .modal-header{display:flex;justify-content:space-between;align-items:center}
#confirm-convert .modal-header h2{margin:0}
#confirm-convert .modal-header .close{cursor:pointer}
#confirm-convert .modal-body p{margin:0}
#confirm-convert .modal-footer{margin-top:20px;text-align:right}
#confirm-convert .modal-footer button{padding:7px 20px;cursor:pointer}
#btn-confirm{background-color:var(--primary-color);color:#fff}
#btn-cancel{background-color:var(--border-light);color:#000}
#btn-confirm:hover,#btn-cancel:hover{filter:brightness(105%);}

/* Enhanced Slideshow */
.mySlides{display:none}
.mySlides > a > img{vertical-align:middle}
.slideshow-container{max-width:620px;position:relative;margin:0 0 40px;border:1px solid var(--border-color);background:var(--background-secondary);box-shadow:var(--shadow-lg);border-radius:0 0 12px 12px;overflow:hidden;float:left}
.prevslide,.nextslide{cursor:pointer;position:absolute;top:50%;transform:translateY(-10%);width:auto;padding:8px 16px 9px 8px;margin-top:-22px;color:var(--accent-color);background-color:var(--background-glass);font-weight:700;font-size:32px;transition:.6s ease;border-radius:0 32px 32px 0;user-select:none}
.nextslide{padding:8px 8px 9px 16px;right:0;border-radius:32px 0 0 32px}
.prevslide:hover,.nextslide:hover{background-color:var(--background-glass)}
.mySlides > .text{color:var(--text-primary);font-size:15px;padding:8px 12px;position:absolute;bottom:8px;width:100%;text-align:center}
.mySlides > .numbertext{color:var(--text-primary);font-size:12px;padding:8px 12px;position:absolute;top:0}
.dotList{position:absolute;bottom:10px;left:50%;transform:translateX(-50%)}
.dot{cursor:pointer;height:15px;width:15px;margin:0 2px;background-color:var(--background-secondary);border-radius:50%;border:2px solid var(--accent-color);display:inline-block;transition:background-color .6s ease}
.fade{-webkit-animation-name:fade;-webkit-animation-duration:1.5s;animation-name:fade;animation-duration:1.5s}
.slide-right-custom{width:250px;float:right;margin:0 0 40px}
.slide-right-custom > .item-right{width:100%;height:48px;font-size:12px;text-transform:uppercase;line-height:48px;margin:0 0 5px}
.slide-right-custom > .item-right > a{display:inline-block;color:var(--text-muted);width:100%;height:100%;padding:0 16px;background-color:var(--background-secondary);cursor:pointer}
.item-right.active a,.dot.active,.dot:hover{background-color:var(--accent-color)!important;color:#fff}

/* Enhanced Animations */
@keyframes spinLoad{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@-webkit-keyframes spinLoad{from{-webkit-transform:rotate(0deg);color:red}to{-webkit-transform:rotate(360deg);color:#ff0}}
@-webkit-keyframes fade{from{opacity:.4}to{opacity:1}}
@keyframes fade{from{opacity:.4}to{opacity:1}}

/* Enhanced Responsive Design */
.page-master-menu .widget{border:1px solid var(--border-color)}
.page-master-menu .widget .inner{background-color:var(--background-card)}
.page-master-menu .widget h3{background:var(--primary-color);color:#fff}
.page-master-menu .widget.menu-serve-list{top:10px}
.page-master-menu .widget.menu-raking-users{top:10px}
.page-master-menu .widget.menu-raking-users .tag{top:0}
.page-master-menu .widget.menu-raking-users #load-ranking-container{display:block;padding:10px 0;font-size:14px;color:var(--accent-color)}
.section-special-items{margin-top:170px!important;border:1px solid var(--border-color)!important}
.section-special-items .title-new{color:var(--accent-color)!important;display:flex!important;width:fit-content;text-align:center;align-items:center}
.section-special-items .title-new h1{margin-left:12px}
.section-special-items .itemTabsAnchor a{color:var(--text-muted)!important}
.section-special-items .itemTabsAnchor a.active{color:var(--accent-color)!important}
.section-special-items .animElement{border:1px solid var(--border-color)!important}
.section-special-items div span{color:var(--text-primary)!important;margin-top:6px;font-size:12px}
.menu-section-fanpage{top:10px!important}

.mobile-nav{display:none}
.dnone{display:block!important}
.clearfix:after{content:"";clear:both;display:table}
.desktop,.mobile{display:flex;justify-content:center}
form.account thead{font-size:15px}
form.account tbody{font-size:14px}
.notify{color:#343a40;font-size:15px;background-color:#f28a1a33;padding:7px 10px;margin-bottom:10px;border-radius:5px}
#loadRanking{font-size:14px}
#captcha_img_src{cursor:pointer}

@media (max-width:1200px) {
    .container{width:100%;padding:0 4%}
    nav#menu{width:320px;height:100vh;padding:20px 0;background:rgba(255,255,255,0.98);backdrop-filter:blur(25px);text-align:left;z-index:9090;position:fixed;overflow-y:auto;top:0;left:0;box-shadow:var(--shadow-xl);border-right:1px solid var(--border-color);-webkit-transform:translateX(-100%);-moz-transform:translateX(-100%);-ms-transform:translateX(-100%);-o-transform:translateX(-100%);transform:translateX(-100%);-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);transition:all var(--transition-medium)}
    nav#menu ul{max-width:1000px;justify-content:space-evenly;padding:0 20px}
    nav#menu > ul > li > a{padding:20px 24px;font-size:15px}
    .menuopen nav#menu{-webkit-transform:translateX(0%);-moz-transform:translateX(0%);-ms-transform:translateX(0%);-o-transform:translateX(0%);transform:translateX(0%)}
    nav#menu:after{display:none}
    nav#menu ul{flex-direction:column;align-items:stretch}
    nav#menu ul li{width:100%;border-bottom:1px solid var(--border-color);display:block;position:relative}
    nav#menu ul li:last-child{border-bottom:none}
    nav#menu a{color:var(--text-primary);text-shadow:none;font-size:15px;font-weight:500}
    nav#menu > ul > li:after{display:none}
    nav#menu:hover > ul > li:after{display:none}
    nav#menu > ul > li > a{padding:16px 20px;text-align:left;border-radius:0}
    nav#menu > ul > li > a:before{display:none}
    nav#menu > ul > li > a:hover{background:var(--background-secondary);padding-left:24px}
    nav#menu > ul > li > ul{position:static;transform:none;width:100%;max-height:0;opacity:0;visibility:hidden;background:var(--background-secondary);border-radius:0;box-shadow:none;border:none;margin:0;transition:all var(--transition-medium)}
    nav#menu > ul > li:hover > ul{padding:0;max-height:300px;opacity:1;visibility:visible}
    nav#menu > ul > li > ul > li > a{padding:12px 40px;background:transparent;font-size:14px}
    nav#menu > ul > li > ul > li > a:hover{background:rgba(99,102,241,0.1);padding-left:44px}
    #menuClose{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);backdrop-filter:blur(5px);z-index:8080;-webkit-filter:opacity(0%);filter:opacity(0%);visibility:hidden;transition:all var(--transition-medium)}
    #menuClose:after{content:'×';font-family:"Inter",sans-serif;font-size:28px;line-height:40px;font-weight:300;color:#fff;position:absolute;top:20px;right:20px;display:block;width:40px;height:40px;text-align:center;background:rgba(255,255,255,0.1);border-radius:50%;cursor:pointer;transition:all var(--transition-medium)}
    #menuClose:hover:after{background:rgba(255,255,255,0.2);transform:scale(1.1)}
    .menuopen #menuClose{visibility:visible;-webkit-filter:opacity(100%);filter:opacity(100%)}
    header{height:auto}
    header .logo{position:relative;z-index:2;text-align:center;padding:50px 0 20px}
    header .logo img{max-width:90%;margin:0}
    header #menuAnchor{position:absolute;display:flex;align-items:center;top:0;left:0;padding:20px;z-index:100;cursor:pointer;transition:all var(--transition-medium)}
    header #menuAnchor:after{content:'MENU';font-size:13px;color:var(--text-primary);display:inline-block;margin-left:15px;font-weight:600;text-transform:uppercase;position:relative;letter-spacing:0.05em}
    header #menuAnchor:hover{background:rgba(99,102,241,0.05);border-radius:8px}
    header #menuAnchor span{width:24px;height:3px;background:var(--text-primary);position:relative;display:block;border-radius:3px;transition:all var(--transition-medium)}
    header #menuAnchor span:nth-child(2){margin:4px 0}
    header #menuAnchor span:nth-child(3){margin:0}
    .menuopen header #menuAnchor span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
    .menuopen header #menuAnchor span:nth-child(2){opacity:0}
    .menuopen header #menuAnchor span:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}
    main{width:100%;display:inline-block;overflow:hidden}
    aside{float:left;width:100%}
    aside .widget{margin:0 0 4%}
    aside .widget h3{background:var(--primary-color);text-align:center;font-size:13px;font-weight:900;color:#fff;text-transform:uppercase;padding:12px}
    aside .widget .inner{padding:14px}
    aside .widget ul{list-style:none;margin:0;padding:0}
    aside #login{margin:0 0 4%;padding-top:15px}
    aside #login:before,aside #login:after{display:none}
    aside #login form{padding:0 0 10px}
    aside #login input{width:100% !important}
    .buttonsSocial a{width:48%;width:calc(50% - 4px)}
    .buttonsSocial a .icon{width:40px}
    .buttonsSocial a small{width:70%;width:calc(100% - 50px);display:inline-block}
    main section{width:100%;float:right}
    main section .box,main section .box.mid{max-width:100%;margin:0 0 4%}
    main section .box.guia{margin-top:46px}
    main section .box.guia > .title{font-size:18px;margin:-60px 0 0 -3%}
    main section .box .biglist{padding:8px 10px 5px}
    main section .box .biglist li{background:var(--background-secondary);border-radius:0;margin:0 0 3%;padding:0 20px 0 0}
    main section .box .biglist li i[class*="icon"]{margin:10px;-webkit-transform:scale(0.9);-moz-transform:scale(0.9);-ms-transform:scale(0.9);-o-transform:scale(0.9);transform:scale(0.9)}
    main section .box .biglist li strong{font-size:14px;margin:12px 0 3px}
    main section .box .biglist li p{font-size:13px}
    main section .box .biglist .recharge-left{width:100%;float:none;padding:0 10px}
    main section .box .biglist .recharge-right{width:100%;text-align:center}
    main section .box.itens{margin-top:46px}
    main section .box.itens > .title{font-size:18px;margin:-50px 0 0 2%}
    main .listsquare{display:block}
    main .listsquare li{background:var(--background-secondary);border:1px solid var(--border-color);border-radius:4px;width:30%;height:80px;margin:0 1.5% 32px;display:inline-block;vertical-align:top}
    main .listsquare li img{vertical-align:top;max-height:68px;margin:5px}
    main #slideHome{width:100%;height:auto;margin:0 0 2%}
    main #slideHomeAnchor{width:100%;margin:0 0 4%}
    main #slideHomeAnchor .item{height:38px;line-height:38px}
    .itemTabsAnchor{margin:10px 0;padding:0 20px}
    .itemTabsAnchor a.active{color:var(--accent-color)}
    .itemTabsAnchor a{color:var(--accent-color);padding:6px 12px;margin:0;transition:all var(--transition-medium)}
    .itemTabsAnchor a:after{display:none}
    main section .cards{width:100%;text-align:center}
    footer{margin:0 0 10px}
    footer .text{margin:0;font-size:16px;padding:20px 0 80px}
    footer .bottom{height:auto;line-height:20px;text-align:center;padding:10px 0}
    footer .bottom .left{width:100%}
    footer .bottom .right{width:100%}
    main .banner{margin:0 0 4%}
    main .box.single{padding:15px}
    main .box.single .share{width:45px;padding:0 15px 0 0}
    main .box.single .content{width:calc(100% - 45px);padding:0 0 0 15px}
    main .box.single .content .title{margin:0 0 15px}
    main .box.single .content p,main .box.single .content ul{font-size:14px;margin:0 0 10px}
    main .box.list ul li.title{padding:14px 20px;font-size:14px}
    main .box.list ul li a{padding:12px 20px}
    main .box.list.pagenavi{padding:10px 10px 6px}
    main .box.list.pagenavi ul li{border:1px solid var(--border-color);border-radius:5px;margin:0 2px 4px 0}
    main .box.list.pagenavi ul li a{height:50px;line-height:50px;vertical-align:top;padding:0 20px}
    main .box.list.pagenavi ul li a.small{font-size:13px}
    main .box.servers{min-height:200px}
    main .box.servers .content{max-width:100%}
    main .box.servers .listtag{margin-bottom:25px}
    footer.servers{margin-top:0}
    footer.servers .text{font-size:12px;color:var(--text-primary);margin:0 0 20px}
    .render02,.render03{display:none}
    div.modal .content{width:90%}
    div.modal .box{padding:20px}
    div.modal .box .button{margin:5px auto}
    div.modal .box .cancel{width:100%}
}
@media only screen and (max-width: 768px) {
    body{background-attachment:scroll;background-size:cover}
    main section{width:100%;float:right}
    main section .box,main section .box.mid{width:100%}
    main section .box.guia{margin-top:46px;display:none}
    main .box.single{padding:15px;margin:0}
    main .box.single .share{display:none}
    main .box.single .content{width:auto;padding:0;border-left:none}
    main .box.single .content .title{font-size:15px;margin:0 0 15px}
    main .box.single .content h3{font-size:16px}
    main .box.single .content p,main .box.single .content ul{font-size:14px}
    main .box.single .content img{width:350px;text-align:center}
    main .box.list ul li.title{padding:14px 20px;font-size:14px}
    main .box.list ul li a{padding:12px 20px}
    main .banner img{width:100%}
    #master-qr-info{display:block;position:fixed;left:0;top:45%;z-index:1}
    #master-qr-info .block-sm{cursor:pointer}
    #master-qr-info .block-sm img{width:54px}
    #master-qr-info .block-more{position:relative;display:none}
    #master-qr-info .block-more .btn-close{position:absolute;top:0;right:-1px;cursor:pointer}
    #master-qr-info .block-more .btn-close svg{fill:#fff;margin:2px 5px}
    #master-qr-info.selected .block-sm{display:none}
    #master-qr-info.selected .block-more{background:var(--accent-color);display:flex;flex-direction:column;padding:35px 15px 15px}
    #master-qr-info.selected .block-more img{width:150px}
    .desktop{display:none}
    .mobile{display:flex}
    .container.mobile{justify-content:center;margin-top:20px;}
    .tabsContent .mobile{display:block!important}
    #qrImageContainer{padding:0}
    #qrImage{width:320px}
    .tabcontent{padding:6px 0}
    .page-master-menu{margin-top:25px}
    header .logo{padding:0}
    header .logo img{width:200px;margin:0}
    #qrImage{margin-top:0}
    main .listtag li a{font-size:13px}
    main .listsquare li{background:var(--background-secondary);border:1px solid var(--border-color);border-radius:4px;width:30%;margin:0 1.5% 32px;display:inline-block;vertical-align:top}
    main .listsquare li img{vertical-align:top;max-height:58px;margin:5px}
    main .listsquare li span{font-size:11px;font-weight:500}
    .button-functional-account .item{width:48%}
    form.detail-account .info{width:35%}
    .button-functional .item,.button-functional.acc .item{width:49.4%}
    .button-functional .item.green,.button-functional .item.darkgray{justify-content:space-evenly}
    .dnone{display:none!important}
    .mobile-nav{position:fixed;bottom:0;left:0;right:0;z-index:1000;display:flex;height:65px;background:var(--accent-dark);border-radius:1.5rem 1.5rem 0 0;box-shadow:0 -4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06)}
    .mobile-item{flex-grow:1;text-align:center;font-size:12px;display:flex;flex-direction:column;justify-content:center}
    .mobile-content.is-active img{filter: invert(17%) sepia(100%) saturate(7493%) hue-rotate(0deg) brightness(99%) contrast(118%)}
    .mobile-content{color:#fff;display:flex;flex-direction:column;align-items: center}
    .mobile-content img{margin:5px 0;width:24px;filter:brightness(110%);}
    .mobile-content img:hover{fill:red}
}
@media only screen and (max-width:576px) {
    .newsTabsAnchor a{font-size:12px;padding:0 8px;line-height:32px}
    .newsTabsAnchor{height:42px;padding:5px;margin-left:0}
    .itemTabsAnchor{float:none;width:100%;margin:10px 0 0;display:flex;flex-wrap:wrap;justify-content:center}
    .itemTabsAnchor a{font-size:13px;padding:4px 8px;border:1px solid var(--border-color);border-radius:20px;margin:2px}
    .itemTabsAnchor a:last-child{border:1px solid var(--border-color)}
    .slide-right-custom{width:100%}
    .slideshow-container{margin:0 0 10px}
    main section .tabsAnchor a{padding:0 .9nem}
    .overlay a{font-size:20px}
    .overlay .closebtn{font-size:40px;top:15px;right:35px}
    section .search{width:100%}
}
@media only screen and (max-width:300px) {
    .prevslide,.nextslide,.mySlides > .text{font-size:11px}
}
/* Enhanced Scrollbar */
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:var(--border-color)}
::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--primary-dark)}

/* Enhanced Selection */
::selection{background:var(--primary-color);color:white}
::-moz-selection{background:var(--primary-color);color:white}

/* Enhanced Animations */
.animElement{opacity:0;transform:translateY(20px);transition:all var(--transition-slow)}
.animElement.in-view{opacity:1;transform:translateY(0)}
.animElement.slide-left{transform:translateX(-20px)}
.animElement.slide-left.in-view{transform:translateX(0)}
.animElement.slide-right{transform:translateX(20px)}
.animElement.slide-right.in-view{transform:translateX(0)}
.animElement.just-show{transform:none}
.animElement.just-show.in-view{opacity:1}
.animElement.zoom-in{transform:scale(0.9)}
.animElement.zoom-in.in-view{transform:scale(1)}