@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800&family=Playfair+Display:wght@600;700&display=swap');
:root{--bg:#f7f1e7;--paper:#fffdf9;--paper-soft:#fbf6ed;--ink:#30261d;--muted:#81715f;--line:#e7d9c2;--gold:#d99522;--gold2:#f3c35c;--orange:#d9781d;--green:#45966f;--red:#c94f48;--blue:#4d7eaa;--shadow:0 8px 24px rgba(70,46,20,.07);--shadow2:0 18px 45px rgba(70,46,20,.11);--r:18px}
*{box-sizing:border-box}html{overflow-x:hidden;background:var(--bg)}body{margin:0;min-height:100%;font-family:"Be Vietnam Pro",system-ui,sans-serif;color:var(--ink);background:radial-gradient(circle at 50% -15%,#fffdf9 0,#faf4e9 42%,#f1e5d2 100%);-webkit-text-size-adjust:100%;overflow-x:hidden}button,input,select,textarea{font:inherit}button{cursor:pointer}
.topbar{height:74px;position:sticky;top:0;z-index:60;display:flex;align-items:center;gap:18px;padding:8px clamp(16px,3vw,46px);background:rgba(255,253,249,.94);backdrop-filter:blur(18px);border-bottom:1px solid rgba(231,217,194,.9)}
.brand{display:flex;align-items:center;gap:10px;min-width:230px}.brand img{width:48px;height:48px;object-fit:contain}.brand b{display:block;font:700 23px "Playfair Display";line-height:1;color:#b66e10}.brand span{display:block;margin-top:4px;font-size:10px;color:var(--muted);font-weight:700}.clock{margin-left:auto;font-size:11px;color:var(--muted)}.topStats{display:flex;align-items:center;gap:15px}.topStats div{text-align:right}.topStats small{display:block;color:var(--muted);font-size:8px}.topStats strong{font-size:12px}.iconBtn{border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:9px 11px;box-shadow:0 3px 10px rgba(70,46,20,.04)}
.appShell{display:flex;width:100%;max-width:1680px;margin:0 auto;min-height:calc(100vh - 74px)}.sidebar{width:230px;flex:0 0 230px;padding:22px 14px;border-right:1px solid rgba(231,217,194,.8);background:rgba(255,253,249,.34)}.sideHead{font-size:9px;letter-spacing:2px;color:#ae7823;font-weight:800;padding:0 10px 10px}.nav{display:flex;align-items:center;gap:9px;width:100%;border:0;background:transparent;color:#685949;text-align:left;padding:11px 12px;border-radius:12px;margin:3px 0;font-size:11px;font-weight:700}.nav span{margin-left:auto;font-size:9px;color:#a18c75}.nav:hover,.nav.active{background:#fff0ce;color:#9f610d;box-shadow:inset 0 0 0 1px #efd39d}.sideNote{margin:28px 8px 0;padding:14px 4px 0;border-top:1px solid var(--line);font-size:9px;line-height:1.7;color:var(--muted)}
.main{width:100%;min-width:0;max-width:1450px;margin:0 auto;padding:28px clamp(18px,3vw,48px) 80px}.hero{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:18px;margin-bottom:18px}.card{background:rgba(255,253,249,.88);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:20px}.heroMain{min-height:238px;display:flex;flex-direction:column;justify-content:center;padding:28px 32px;background:linear-gradient(135deg,#fffdf9 0,#fff6df 58%,#ffebc1 100%);overflow:hidden;position:relative}.heroMain:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:-100px;top:-105px;background:rgba(246,196,91,.12)}.eyebrow{font-size:9px;letter-spacing:3px;color:#b67818;font-weight:800}.hero h1{font:700 clamp(31px,4vw,49px) "Playfair Display";margin:8px 0 7px;line-height:1.05}.hero p{max-width:780px;color:var(--muted);line-height:1.65;font-size:12px;margin:0}.heroLogo{display:flex;justify-content:center;align-items:center;min-height:238px;background:linear-gradient(145deg,#fff8e7,#f5d99e)}.heroLogo img{width:min(100%,330px);max-height:210px;object-fit:contain;filter:drop-shadow(0 14px 16px rgba(75,48,10,.13))}
.kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px;margin-bottom:22px}.kpi{background:rgba(255,253,249,.92);border:1px solid var(--line);border-radius:15px;padding:14px 15px;min-width:0}.kpi small{font-size:9px;color:var(--muted);white-space:nowrap}.kpi strong{display:block;margin-top:5px;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sectionTitle{display:flex;align-items:end;justify-content:space-between;gap:14px;margin:7px 2px 11px}.sectionTitle h2{font:700 25px "Playfair Display";margin:0;line-height:1.1}.sectionTitle span{font-size:9px;color:var(--muted);text-align:right}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.actionCard{position:relative;overflow:hidden;transition:transform .16s,box-shadow .16s}.actionCard:hover{transform:translateY(-2px);box-shadow:var(--shadow2)}.bigIcon{font-size:25px}.actionCard h3{font-size:14px;margin:8px 0 4px}.actionCard p{font-size:10px;color:var(--muted);line-height:1.55;min-height:33px;margin:0 0 12px}.btn{border:1px solid #d39a35;background:linear-gradient(180deg,#f7d27a,#e7ac3c);color:#3e2a10;border-radius:11px;padding:9px 13px;font-size:10px;font-weight:800;box-shadow:0 3px 8px rgba(119,73,15,.08)}.btn:hover{filter:brightness(1.02)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.secondary{background:#fffaf1;border-color:var(--line);color:#6e5b46;box-shadow:none}.btn.danger{background:#fff0ed;border-color:#edc1bb;color:#a83e38}.btn.blue{background:#edf5fc;border-color:#c8d9e8;color:#3e6e9d}.btn.wide{width:100%}.row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.tableWrap{overflow:auto;border:1px solid var(--line);border-radius:13px}.table{width:100%;border-collapse:collapse;min-width:640px;background:var(--paper)}.table th,.table td{padding:10px 8px;text-align:left;border-bottom:1px solid var(--line);font-size:10px}.table th{color:var(--muted);font-size:8px;letter-spacing:.4px}.progress{height:8px;background:#eee3cf;border-radius:99px;overflow:hidden}.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--orange));border-radius:99px}.pill{display:inline-flex;padding:5px 8px;border-radius:99px;background:#fff1d3;font-size:8px;font-weight:800;color:#a46b14}.good{color:var(--green)}.bad{color:var(--red)}.info{color:var(--blue)}.timeline{display:flex;gap:9px;overflow:auto}.event{min-width:190px;background:#fff7e8;border:1px solid var(--line);border-radius:13px;padding:12px}.event b{font-size:11px}.event small{display:block;color:var(--muted);font-size:9px;line-height:1.5;margin-top:5px}.doc{background:#fffdf7;border:2px solid #dfc487;border-radius:10px;padding:24px;position:relative;box-shadow:var(--shadow)}.doc h2{text-align:center;font:700 23px "Playfair Display"}.doc:after{content:"ĐÃ PHÊ DUYỆT";position:absolute;right:15px;bottom:15px;border:2px solid #b9433b;color:#b9433b;transform:rotate(-8deg);padding:5px 8px;font-size:8px;font-weight:800;opacity:.8}.signature{font-family:cursive;color:#164f99;font-size:25px}.seal{width:56px;height:56px;border:2px solid #b9433b;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#b9433b;text-align:center;font-size:8px;font-weight:800}
.modalBack{position:fixed;inset:0;z-index:200;background:rgba(38,27,15,.48);backdrop-filter:blur(7px);display:flex;align-items:center;justify-content:center;padding:16px}.modal{width:min(680px,100%);max-height:91dvh;overflow:auto;background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:0 30px 80px rgba(0,0,0,.22)}.modal h2{font:700 23px "Playfair Display";margin:0 0 8px}.modal p{font-size:10px;line-height:1.65;color:var(--muted)}.field{margin:10px 0}.field label{display:block;font-size:9px;font-weight:800;color:#6b5a47;margin-bottom:5px}.field input,.field select,.field textarea{width:100%;border:1px solid #dfd0b7;background:#fffaf0;border-radius:10px;padding:10px;outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:#d9a143;box-shadow:0 0 0 3px rgba(217,161,67,.12)}.field textarea{min-height:90px;resize:vertical}.toast{position:fixed;z-index:300;right:18px;top:90px;background:#34271b;color:#fff;border-radius:13px;padding:11px 14px;font-size:10px;box-shadow:0 15px 35px rgba(0,0,0,.22);animation:toastIn .2s ease;max-width:360px}@keyframes toastIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}.notice{padding:12px;border-radius:12px;background:#fff5dc;border:1px solid #ecd39f;font-size:9px;line-height:1.55}.mobileNav{display:none}
.authBack{position:fixed!important;inset:0!important;z-index:9999!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:24px!important;background:radial-gradient(circle at 50% 10%,rgba(255,247,225,.82),rgba(45,31,18,.67) 72%),rgba(44,31,18,.58)!important;backdrop-filter:blur(13px)!important;overflow:auto}.authCard{width:min(430px,100%);max-height:calc(100dvh - 48px);overflow:auto;margin:auto;background:rgba(255,253,248,.98);border:1px solid #eadcc4;border-radius:26px;padding:26px 28px 24px;box-shadow:0 35px 100px rgba(0,0,0,.28);text-align:center}.authLogoWrap{display:flex;justify-content:center;align-items:center;height:116px;margin:-3px auto 5px}.authLogo{display:block!important;width:112px!important;height:112px!important;max-width:42vw;object-fit:contain!important;filter:drop-shadow(0 12px 20px rgba(95,58,12,.17))}.authCard h1{font:700 30px "Playfair Display";margin:0;color:#b56e11}.authCard p{margin:4px 0 19px;color:#7d6d59;font-size:11px}.authTabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:#f4ead8;padding:5px;border-radius:13px;margin-bottom:16px}.authTabs button{border:0;background:transparent;padding:10px;border-radius:9px;color:#786754;font-weight:700;font-size:10px}.authTabs button.active{background:#fffdf8;color:#a86612;box-shadow:0 2px 8px rgba(70,44,15,.08)}.authCard .field{text-align:left}.authCard .field input{min-height:44px}.authSubmit{min-height:45px}.authCard small{display:block;color:#b0443e;margin-top:10px;min-height:18px;font-size:9px}.authOpen{overflow:hidden}.authOpen .topbar,.authOpen .appShell,.authOpen .mobileNav{visibility:hidden;pointer-events:none}.authOpen #toastLayer{display:none}
.profileHero{display:flex;align-items:center;gap:18px;background:linear-gradient(135deg,#fffdf8,#ffedc5);margin-bottom:12px}.profileHero h1{font:700 32px "Playfair Display";margin:8px 0 3px;color:#a9630d}.profileHero p{margin:4px 0;color:var(--muted)}.avatar{width:82px;height:82px;flex:0 0 82px;border-radius:24px;background:linear-gradient(145deg,#f8d37c,#e9a83b);display:grid;place-items:center;font-size:42px;box-shadow:0 12px 25px rgba(100,60,10,.16)}.inlineInput,.socialCompose select{border:1px solid var(--line);background:#fffaf0;border-radius:10px;padding:9px 11px;min-width:0;outline:none}.socialRow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 0;border-bottom:1px solid var(--line);font-size:10px}.socialRow span{color:var(--muted)}.messageList{display:flex;flex-direction:column;gap:7px;margin-top:12px;max-height:430px;overflow:auto}.message{align-self:flex-start;max-width:82%;background:#fff5df;border:1px solid var(--line);border-radius:13px 13px 13px 4px;padding:9px 11px;font-size:10px;line-height:1.5}.message.mine{align-self:flex-end;background:#fff0cd;border-radius:13px 13px 4px 13px}.message small{color:var(--muted);font-size:8px}.socialCompose{margin-top:10px}.socialCompose select{flex:0 1 210px}.socialCompose .inlineInput{flex:1 1 220px}.reportRow{padding:10px 0;border-bottom:1px solid var(--line);font-size:9px;line-height:1.55}.adminKpis .kpi{background:#fffaf0}
@media(max-width:1120px){.sidebar{width:205px;flex-basis:205px}.main{padding-left:20px;padding-right:20px}.hero{grid-template-columns:1fr 270px}.kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.topbar{height:64px;padding:7px 10px;gap:8px}.brand{min-width:0}.brand img{width:42px;height:42px}.brand b{font-size:18px}.brand span{font-size:8px}.clock{display:none}.topStats{margin-left:auto;gap:6px}.topStats div{display:none}.iconBtn{padding:8px}.sidebar{display:none}.main{padding:12px 10px calc(94px + env(safe-area-inset-bottom));width:100%;}.hero{display:block;margin-bottom:10px}.heroMain{min-height:195px;padding:20px 18px;border-radius:17px}.heroLogo{display:none}.hero h1{font-size:30px}.hero p{font-size:10px}.card{padding:14px;border-radius:16px}.kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:18px}.kpi{padding:11px 12px}.kpi small{font-size:8px}.kpi strong{font-size:15px}.sectionTitle{margin-top:5px}.sectionTitle h2{font-size:21px}.sectionTitle span{font-size:8px}.grid{grid-template-columns:1fr;gap:9px}.actionCard{padding:14px}.actionCard h3{font-size:13px}.actionCard p{font-size:9px;min-height:0;margin-bottom:10px}.bigIcon{font-size:24px}.btn{font-size:9px;padding:9px 11px;min-height:40px}.timeline{margin-bottom:4px}.event{min-width:175px}.tableWrap{margin-left:-2px;margin-right:-2px}.table{min-width:560px}.modalBack{padding:10px}.modal{max-height:calc(100dvh - 20px);border-radius:17px;padding:16px}.authBack{padding:12px!important}.authCard{width:min(420px,100%);max-height:calc(100dvh - 24px);padding:20px 16px 18px;border-radius:21px}.authLogoWrap{height:90px}.authLogo{width:88px!important;height:88px!important}.authCard h1{font-size:27px}.authCard p{font-size:10px;margin-bottom:13px}.authTabs{margin-bottom:12px}.field{margin:8px 0}.field input,.field select,.field textarea{min-height:43px}.mobileNav{display:grid;position:fixed;left:7px;right:7px;bottom:max(7px,env(safe-area-inset-bottom));z-index:80;grid-template-columns:repeat(5,1fr);background:rgba(255,253,248,.97);border:1px solid var(--line);border-radius:18px;box-shadow:0 14px 38px rgba(60,39,16,.18);padding:6px 3px;backdrop-filter:blur(14px)}.mobileNav button{border:0;background:transparent;color:#766553;padding:4px 2px;font-size:18px;line-height:1}.mobileNav button span{display:block;font-size:7px;margin-top:4px;white-space:nowrap}.mobileNav button.active{color:#b16c12;font-weight:800}.profileHero{padding:13px;gap:12px}.profileHero h1{font-size:25px}.avatar{width:65px;height:65px;flex-basis:65px;font-size:32px;border-radius:19px}.socialCompose{display:grid;grid-template-columns:1fr;gap:7px}.socialCompose select,.socialCompose .inlineInput{width:100%;min-width:0}.socialCompose button{width:100%}.message{max-width:92%}}
@media(min-width:761px) and (max-width:1120px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important}}

/* v2.4.4-leaderboard */
.leaderboardBtn{font-size:20px}
#leaderboardRoot{position:fixed;inset:0;z-index:99999}
.lb-back{position:absolute;inset:0;background:rgba(35,25,15,.48);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:22px}
.lb-panel{width:min(920px,100%);max-height:min(88vh,900px);overflow:auto;background:#fffaf1;border:1px solid #ead7b7;border-radius:28px;box-shadow:0 30px 90px rgba(45,30,15,.25);padding:28px;color:#3b2c20;position:relative}
.lb-x{position:absolute;right:18px;top:16px;border:0;background:#f6ead7;border-radius:50%;width:42px;height:42px;font-size:28px;cursor:pointer;color:#5d4732}
.lb-kicker{font-size:12px;font-weight:800;letter-spacing:.18em;color:#b87510}.lb-head h2{font-size:34px;margin:7px 0 4px}.lb-head p{margin:0;color:#8b765e}
.lb-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 14px}.lb-tab{border:1px solid #e5d2b2;background:#fffdf9;border-radius:999px;padding:10px 15px;font-weight:700;color:#765f47;cursor:pointer}.lb-tab.active{background:#f1b53e;color:#3b2c20;border-color:#d89517}
.lb-status{font-size:13px;color:#8b765e;margin:8px 2px 12px}.lb-list{display:grid;gap:10px}
.lb-row{display:grid;grid-template-columns:62px 48px 1fr auto;align-items:center;gap:12px;padding:14px 16px;background:#fffdf9;border:1px solid #ead9bc;border-radius:18px}.lb-row.top3{background:#fff3d7}
.lb-rank{font-size:20px;font-weight:900;text-align:center}.lb-avatar{width:44px;height:44px;border-radius:14px;background:#f4e6cd;display:grid;place-items:center;font-size:22px}
.lb-main{min-width:0;display:flex;flex-direction:column;gap:2px}.lb-main strong{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lb-main span,.lb-main small{font-size:12px;color:#8b765e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lb-value{text-align:right}.lb-value strong{display:block;font-size:17px}.lb-value span{font-size:11px;color:#8b765e}
@media(max-width:640px){.lb-back{padding:10px}.lb-panel{padding:20px 12px 16px;border-radius:22px;max-height:92vh}.lb-head{padding-right:38px}.lb-head h2{font-size:27px}.lb-tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:3px}.lb-tab{white-space:nowrap;padding:9px 12px;font-size:12px}.lb-row{grid-template-columns:40px 40px 1fr;gap:8px;padding:11px 9px}.lb-value{grid-column:3;text-align:left;margin-top:-2px}.lb-value strong{font-size:14px}.lb-value span{font-size:10px}.lb-main strong{font-size:14px}.lb-main span,.lb-main small{font-size:11px}.lb-rank{font-size:16px}.lb-avatar{width:38px;height:38px;border-radius:12px}}

.profileControls{margin:14px 0;display:flex;gap:10px;flex-wrap:wrap}
.profileHero .avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}

.profileStats{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.profileStats span{background:#fff8e9;border:1px solid var(--line);border-radius:999px;padding:6px 9px;font-size:9px;color:var(--muted)}.profileStats b{color:var(--ink)}.avatarImage{overflow:hidden}.avatarImage img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
@media(max-width:760px){.profileStats{gap:5px}.profileStats span{font-size:8px;padding:5px 7px}}