:root{--accent:#e61950;--bg:#f7f8fa;--panel:#fff;--text:#141a2b;--muted:#77808e;--line:#e9ebef;--soft:#fceef2;--shadow:0 5px 20px #20202e05}*{box-sizing:border-box}body{margin:0;font:14px 'Segoe UI',Arial,sans-serif;background:var(--bg);color:var(--text)}button,input,textarea,select{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button{border:0;background:none;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #839bfa;outline-offset:4px}button:disabled{opacity:.55;cursor:not-allowed}aside{width:248px;background:var(--panel);border-right:1px solid var(--line);position:fixed;inset:0 auto 0 0;z-index:40;display:flex;flex-direction:column}.brand{height:64px;display:flex;gap:10px;align-items:center;padding:12px 24px;border-bottom:1px solid var(--line);font-size:25px;font-weight:900;letter-spacing:1px}.brandmark{background:linear-gradient(135deg,#eb2360,#7327d9);color:#fff;display:grid;place-items:center;width:36px;height:36px;border-radius:10px;font-size:28px}.brand-sub{display:block;font-size:8px;letter-spacing:2px;color:var(--muted)}#sidenav{padding:12px}.nav-link{display:flex;align-items:center;gap:11px;padding:14px 12px;border-radius:12px;margin-bottom:7px;font-weight:700;font-size:13px;min-height:49px}.nav-link:hover{background:var(--bg)}.nav-link.active{color:var(--accent);background:var(--soft);box-shadow:inset 0 0 0 1px #e6195015}.nav-icon{display:grid;place-items:center;flex-shrink:0;width:29px;height:29px;background:#f0edf8;color:#8460d5;border-radius:8px;font-size:18px}.active .nav-icon{background:var(--accent);color:#fff}.nav-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-link small,.header-nav small{font-size:9px;background:#f1dcff;color:#923bc7;padding:3px 5px;border-radius:4px;margin-left:auto}.nav-link small.new{background:#ffdde4;color:#e02e56}.nav-title{padding:17px 12px 10px;color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.6px}.side-bottom{margin-top:auto;border-top:1px solid var(--line);padding:12px}.theme-switch{display:flex;align-items:center;gap:9px;width:100%;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:13px;margin-bottom:9px;font-size:12px}.toggle{width:28px;height:16px;border-radius:20px;background:#dbe0e6;margin-left:auto}.toggle:before{content:'';display:block;width:12px;height:12px;border-radius:50%;background:white;margin:2px}.primary{background:var(--accent);color:#fff;font-weight:750;padding:10px 15px;border-radius:10px;box-shadow:0 4px 9px #e6195022}.primary:hover{filter:brightness(.94)}.full{width:100%}.shell{margin-left:248px}.topline{height:44px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 30px;gap:24px;font-size:12px;font-weight:600;color:#667084;background:var(--panel)}.topline button{margin-left:auto;color:var(--accent);font-weight:800;white-space:nowrap}.live-dot{display:inline-block;width:7px;height:7px;background:#22ba8c;border-radius:50%;margin-right:6px}.topline span{white-space:nowrap}header{height:66px;display:flex;align-items:center;justify-content:center;gap:20px;background:var(--panel);border-bottom:1px solid var(--line);padding:0 28px}.header-nav{display:flex;gap:20px;align-items:center;margin:auto}.header-nav a{font-weight:750}.header-nav a:first-child{color:var(--accent)}.header-actions{display:flex;align-items:center;gap:8px;font-size:12px}.moon,.register{border:1px solid var(--line);padding:9px 12px;border-radius:10px;font-weight:700}.dropdown{position:relative}.dropdown>button{padding:12px;background:#f3edf9;color:#7953b5;border:1px solid #e8ddf3;border-radius:12px;font-weight:800;display:flex;align-items:center;gap:7px}.dropdown-list{position:absolute;top:49px;left:0;min-width:285px;background:var(--panel);border:1px solid var(--line);box-shadow:0 10px 30px #1112;border-radius:14px;padding:8px;display:none;z-index:20}.dropdown-list.open{display:block}.dropdown-list a{display:block;padding:13px;border-radius:9px;font-size:12px}.dropdown-list a:hover{background:var(--soft)}main{max-width:1500px;margin:auto;padding:38px 32px 34px}.hero{text-align:center;margin:0 auto 36px}.eyebrow{display:inline-flex;align-items:center;gap:7px;border:1px solid #f2d5bb;background:linear-gradient(100deg,#fff9e9,#f9e9f1);color:#bf701a;font-size:11px;font-weight:850;border-radius:30px;padding:8px 15px;letter-spacing:.5px}.hero h1{font-size:clamp(24px,2.65vw,42px);letter-spacing:-1px;font-weight:950;line-height:1.2;margin:13px 0 21px}.hero-links{display:flex;gap:12px;justify-content:center}.pill{border:1px solid var(--line);padding:9px 15px;border-radius:14px;background:var(--panel);font-size:11px;font-weight:850;box-shadow:var(--shadow)}.announcement{border:1px solid #efe1bc;background:linear-gradient(120deg,#fffcf0,var(--panel));border-radius:20px;padding:20px;display:flex;gap:15px;margin-bottom:16px;box-shadow:var(--shadow)}.announce-icon{background:#fff0bf;color:#dfad24;font-size:23px;border:1px solid #f2e4af;padding:10px;border-radius:13px;height:45px}.announce-copy{flex:1;font-size:12px;line-height:1.8}.announce-copy h2{font-size:13px;color:#a86a18;margin:0 0 4px;font-weight:900;letter-spacing:.5px}.announce-copy p{margin:0 0 3px}.announce-copy a{color:var(--accent);font-weight:700;text-decoration:underline}.announce-top{display:flex;justify-content:space-between;gap:15px}.announce-top button{color:var(--accent);font-size:11px;font-weight:800}.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.tool-card{position:relative;overflow:hidden;border:1px solid #ffffff28;border-radius:24px;min-height:375px;padding:18px 16px;display:flex;gap:16px;color:white;box-shadow:0 8px 22px #22222209}.tool-card:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 100% 100%,#d53c8430,transparent 60%);pointer-events:none}.tool-card.purple{background:linear-gradient(125deg,#1e0d3f,#150926 65%,#350c3c)}.tool-card.blue{background:linear-gradient(125deg,#052735,#071626 65%,#093c53)}.tool-card.gold{background:linear-gradient(125deg,#362304,#201505 65%,#3f2c06)}.tool-media{width:39%;flex-shrink:0;display:flex;flex-direction:column;justify-content:center;gap:9px;z-index:1}.tool-media img{width:100%;border-radius:10px;border:1px solid #ffffff30;box-shadow:0 0 22px #b66bff30}.mini-cta{border:1px solid #b67cff70;color:#e3cbff;background:#762b9033;border-radius:8px;text-align:left;padding:9px;font-size:10px;font-weight:900;line-height:1.5}.blue .mini-cta{color:#a9eaff;border-color:#2594b06b;background:#1688ab26}.gold .mini-cta{color:#ffe6ab;border-color:#c6993870;background:#a16e1026}.tool-copy{display:flex;flex-direction:column;flex:1;min-width:0;z-index:1}.tool-copy h2{font-size:14px;font-weight:900;color:#f99fca;line-height:1.4;margin:0 0 10px}.blue .tool-copy h2{color:#68d7ff}.gold .tool-copy h2{color:#ffcf68}.tool-copy p{font-size:12px;font-weight:600;line-height:1.5;color:#e3dfeb;margin:0 0 7px}.tool-copy .tool-note{font-size:10px;color:#ff9a8e;font-weight:800}.tool-cta{display:flex;align-items:center;justify-content:space-between;gap:8px;background:linear-gradient(100deg,#8022ce,#e01e59);border-radius:12px;padding:13px 12px;margin-top:auto;font-size:12px;font-weight:900;line-height:1.45;color:white}.blue .tool-cta{background:linear-gradient(100deg,#0095c9,#6a35dc)}.gold .tool-cta{background:linear-gradient(100deg,#d48a00,#d9ab22)}.tool-cta:hover{filter:brightness(1.2)}.section{margin-top:30px;background:var(--panel);border:1px solid var(--line);border-radius:18px;overflow:hidden}.section-heading{padding:22px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.section-heading h2{font-size:18px;margin:0 0 6px}.muted,.section-heading p{color:var(--muted);font-size:12px;margin:0}.status-badge{border-radius:20px;background:#e7f8ef;color:#1d986d;font-size:10px;font-weight:800;padding:7px 10px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:12px}th{text-align:left;background:var(--bg);color:var(--muted);font-size:11px;padding:15px 22px}td{padding:19px 22px;border-bottom:1px solid var(--line)}.empty{text-align:center;padding:38px 20px;color:var(--muted);font-size:13px}.empty-symbol{font-size:29px;opacity:.5;margin-bottom:9px}.section-footer{padding:13px 22px;font-size:11px;color:var(--muted);background:var(--bg)}footer{border-top:1px solid var(--line);padding:20px 32px;color:var(--muted);font-size:11px;line-height:2}footer>span{float:right}.contact-wrap{position:fixed;bottom:22px;right:25px;z-index:45}.contact{background:#152038;color:white;border:2px solid #4668ef;border-radius:28px;padding:13px 19px;font-size:12px;font-weight:800;box-shadow:0 5px 25px #132a4930}.contact-panel{width:245px;background:var(--panel);padding:20px;border:1px solid var(--line);box-shadow:0 7px 35px #0002;border-radius:15px;margin-bottom:12px}.contact-panel p{font-size:12px;color:var(--muted)}.contact-panel a{color:var(--accent);font-weight:800}dialog{max-width:510px;width:calc(100% - 32px);border:0;padding:29px;border-radius:18px;color:var(--text);background:var(--panel);box-shadow:0 20px 100px #0003}dialog::backdrop{background:#0a102570}dialog h2{font-size:19px;text-align:center;margin:0 0 24px;font-weight:900}dialog p{line-height:1.8;font-size:14px}dialog a{font-size:12px;color:var(--accent);font-weight:850;text-decoration:underline}.understood{display:block;margin:25px auto 0;padding:13px 24px}.close{position:absolute;top:8px;right:12px;font-size:25px;color:var(--muted)}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);z-index:100;background:#18243b;color:#fff;padding:13px 22px;border-radius:12px;box-shadow:0 4px 20px #0002;display:none;max-width:90%;font-size:13px}.toast.visible{display:block}.page-heading{margin:0 0 8px;font-size:28px}.breadcrumb{font-size:12px;color:var(--muted);margin-bottom:22px}.workspace{padding:25px}.info-box{padding:15px 18px;background:#fff6df;color:#8a6528;border:1px solid #f0dfb7;border-radius:12px;font-size:13px;line-height:1.7;margin:20px 0}.form-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:24px}label{display:block;font-weight:700;font-size:13px;margin:15px 0 8px}textarea,input,select{display:block;width:100%;padding:12px 14px;border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:10px;outline-color:var(--accent)}textarea{min-height:190px;resize:vertical;line-height:1.8}.actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:15px}.secondary{padding:10px 15px;border:1px solid var(--line);background:var(--panel);border-radius:10px;font-weight:700;font-size:12px}.stat-list{margin:0;padding:0;list-style:none}.stat-list li{display:flex;justify-content:space-between;padding:15px 0;border-bottom:1px solid var(--line);font-size:13px}.form-card{max-width:470px;margin:20px auto;padding:30px}.form-card h1{font-size:25px;margin-top:0}.form-card .primary{margin-top:20px}.form-card p{font-size:12px;line-height:1.7;color:var(--muted)}.form-card a{color:var(--accent);font-weight:800}.hamburger,.mobile-brand{display:none}.veil{display:none}[hidden]{display:none!important}.dark{--bg:#101521;--panel:#191f2e;--text:#ebedf4;--muted:#9aa4b8;--line:#2a3142;--soft:#382336}.dark .announcement{background:linear-gradient(120deg,#2b281e,var(--panel));border-color:#51432c}.dark .eyebrow{background:#302432;border-color:#5b3939;color:#facd8a}.dark .dropdown>button{background:#2b233e;border-color:#44345d;color:#d1a6ff}.dark .info-box{background:#332c1b;border-color:#594b2d;color:#e6c98e}.dark .toggle{background:var(--accent)}.dark .toggle:before{margin-left:14px}.dark .nav-icon{background:#2e2841}
@media(min-width:1550px){.tool-card{min-height:360px}.tool-copy h2{font-size:17px}.tool-copy p{font-size:14px}}@media(max-width:1190px){aside{width:220px}.shell{margin-left:220px}.topline{padding:0 20px;gap:16px}.topline span:nth-child(3){display:none}main{padding:30px 22px}.tool-card{flex-direction:column;padding:19px}.tool-media{width:100%;display:block}.tool-media img{width:100%;max-height:145px;object-fit:cover}.mini-cta{display:none}.tool-copy{gap:2px}.tool-cta{margin-top:14px}.tool-copy p{font-size:12px}.header-nav{gap:12px}.header-nav>a:last-child{display:none}header{padding:0 18px;gap:10px}.register{display:none}}@media(max-width:850px){aside{transform:translateX(-100%);transition:transform .22s;width:255px}.shell{margin-left:0}.menu-open aside{transform:translateX(0)}.menu-open .veil{display:block;position:fixed;inset:0;background:#0007;z-index:35}.topline{height:34px;padding:0 18px;font-size:10px}.topline span:nth-child(2){display:none}header{height:65px;justify-content:flex-start;gap:15px}.hamburger{display:block;font-size:21px}.mobile-brand{display:block;font-weight:950;font-size:21px}.mobile-brand b{color:var(--accent)}.header-nav{margin-left:auto;margin-right:0}.header-nav>a{display:none}.dropdown>button{font-size:11px;padding:9px}.dropdown>button small{display:none}.header-actions .primary{display:none}.header-actions{gap:0}.dropdown-list{left:auto;right:0}.hero h1{font-size:28px}.tool-card{min-height:370px}.tool-grid{gap:12px}.tool-copy h2{font-size:13px}.tool-copy p{font-size:11px}.tool-cta{font-size:11px;padding:12px}.announcement{padding:17px}.hero{margin-bottom:27px}main{padding:28px 18px}.form-grid{grid-template-columns:1fr}footer>span{float:none;display:block}}@media(max-width:580px){.tool-grid{grid-template-columns:1fr}.tool-card{flex-direction:row;min-height:300px;gap:18px;padding:21px 18px}.tool-media{width:37%;display:flex}.tool-media img{max-height:none;object-fit:contain}.mini-cta{display:block}.tool-copy h2{font-size:14px}.tool-copy p{font-size:12px}.tool-cta{font-size:12px}.hero h1{font-size:27px;line-height:1.3;letter-spacing:-.7px}.eyebrow{font-size:9px;padding:8px 11px}.hero-links{gap:7px}.pill{padding:9px 10px;font-size:9px}.announce-icon{display:none}.announce-top button{display:none}.announcement{border-radius:15px}.announce-copy{font-size:11px}.announce-copy h2{font-size:12px}.section-heading{padding:18px}.section-heading h2{font-size:16px}.section-heading p{font-size:11px}.status-badge{font-size:9px}.topline button{font-size:10px}.dropdown>button{font-size:0;gap:0}.dropdown>button:first-letter{font-size:17px}.dropdown>button{width:35px;height:35px;padding:0;display:grid;place-items:center}.dropdown>button:after{content:'🎮';font-size:17px}.header-actions .moon{padding:8px 11px}.header-nav{margin-left:auto}.contact-wrap{right:15px;bottom:16px}.contact{padding:11px 16px}.workspace{padding:18px}.page-heading{font-size:23px}.form-card{padding:22px}footer{padding:20px 18px 80px}dialog{padding:27px 22px}dialog h2{font-size:17px}}
.brand-image{width:100%;max-width:170px;height:42px;object-fit:contain}.user-pill{background:var(--soft);padding:10px 13px;border-radius:10px;white-space:nowrap;font-size:12px;font-weight:700}.user-pill b{color:var(--accent);margin-left:9px}.user-link{display:block;text-align:center}.amount{color:#189d6f;font-weight:800}.dark{--bg:#101521!important}.announce-top>a{font-size:11px;white-space:nowrap}.brand>span:last-child{font-size:18px;letter-spacing:0}.section{scroll-margin-top:18px}
/* GHEPANH.SKIN exact event-home overrides */
:root{--panel:#fff;--text:#141a2b;--notice:#fff9ef}
body{font-family:Inter,"Be Vietnam Pro","Segoe UI",Arial,sans-serif;font-size:14px;font-weight:400;letter-spacing:-.01em}
.side-user{padding:14px 13px;border-bottom:1px solid var(--line);min-height:74px;display:flex;align-items:center;gap:10px}
.side-avatar{width:37px;height:37px;display:grid;place-items:center;flex:none;border-radius:11px;background:linear-gradient(135deg,#ff8424,var(--accent));color:white;font-size:16px;font-weight:900;box-shadow:0 6px 14px #e6195033}
.side-user-copy{min-width:0}.side-user-copy b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.side-user-copy small{display:block;margin-top:4px;color:var(--muted);font-size:10px;font-weight:650}.side-user-copy em{color:var(--accent);font-style:normal;font-weight:900}
#side-auth form{margin:0}.logout-button{width:100%;border:1px solid #fecdd5;background:#fff1f3;color:#e61950;border-radius:12px;padding:12px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:7px}.dark .logout-button{background:#33202a;border-color:#5c2938}
.user-pill{display:flex;align-items:center;gap:8px;border-radius:12px;background:#f2f5f9;padding:10px 13px;font-weight:800}.user-pill b{color:var(--accent)}
main{padding:36px 32px 48px;max-width:none}.hero{padding:4px 0 32px;margin-bottom:0}.hero h1{font-family:Inter,"Be Vietnam Pro","Segoe UI",Arial,sans-serif;font-size:clamp(31px,2.8vw,43px);font-weight:900;letter-spacing:-1.65px;line-height:1.15}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.03em}.announcement{background:linear-gradient(100deg,var(--notice),var(--panel));min-height:164px}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.tool-card{min-height:238px;padding:13px 14px;gap:16px}.tool-media{width:41%;justify-content:stretch}.tool-media img,.tool-placeholder{width:100%;min-height:0;flex:1;aspect-ratio:1.72;object-fit:cover;border-radius:11px;border:2px solid #ffffff35}.tool-placeholder{display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse at 70% 0,#8150d1,#211432);font-weight:900;text-align:center;padding:12px}.tool-placeholder span{font-size:38px}.tool-copy h2{font-size:15px;line-height:1.35}.tool-copy p{font-size:12px;line-height:1.45}.tool-cta{font-size:13px;padding:10px 12px}.mini-cta{text-align:center}.category-filters{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 14px}.category-filters button{border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:7px 12px;color:var(--muted);font-size:11px;font-weight:750}.category-filters button.active{color:var(--accent);border-color:var(--accent);background:var(--soft)}.tool-card[hidden]{display:none!important}.disabled{pointer-events:none;opacity:.55}.dark{--panel:#191f2e;--text:#ebedf4;--notice:#2b281e}
@media(max-width:1250px){.tool-grid{grid-template-columns:1fr}.tool-card{min-height:250px}}
@media(max-width:850px){main{padding:28px 18px}.tool-grid{grid-template-columns:1fr}}
@media(max-width:580px){.tool-card{flex-direction:column;min-height:0}.tool-media{width:100%}.tool-media img,.tool-placeholder{min-height:185px}.tool-copy h2{font-size:14px}.hero h1{font-size:27px}.side-user{min-height:66px}}
.brand{font-family:Inter,"Be Vietnam Pro","Segoe UI",Arial,sans-serif;font-size:18px;padding:12px 15px}.brandmark{font-family:Inter,"Segoe UI",Arial,sans-serif}.brand-sub{font-size:7px}.nav-link,.header-nav,.topline,.tool-copy,.announcement{font-family:Inter,"Be Vietnam Pro","Segoe UI",Arial,sans-serif}
/* Pixel alignment with supplied 1925 × 998 reference */
.nav-icon{overflow:hidden}.nav-thumb{display:block;width:29px;height:29px;object-fit:cover;border-radius:8px}.account-actions{display:flex;align-items:center;gap:8px}.wallet-pill,.user-pill{height:40px;display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:13px;padding:0 12px;font-size:12px;font-weight:800;white-space:nowrap}.wallet-pill{color:var(--accent);background:#fff8f9;border-color:#ffd3dc}.admin-pill{color:#2563eb;background:#eef5ff;border-color:#bfdbfe}.admin-pill>.ui-icon{color:#2563eb}.wallet-pill b{display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--accent);color:white}.user-pill{background:#f1f4f8;color:var(--text)}.header-avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--accent);color:white;font-style:normal;font-size:14px}.tool-card .tool-copy h2,.tool-card.blue .tool-copy h2,.tool-card.gold .tool-copy h2{color:#f0523c}.announcement{border-radius:17px;padding:20px}.announce-copy h2{color:#b86608}.announce-icon{width:44px;display:grid;place-items:center;padding:0}.tool-copy{padding-top:2px}.tool-card{border-radius:24px}.header-nav>a,.dropdown>button{font-weight:750}.topline{height:46px}.brand{height:64px}.side-user{height:64px}header{height:64px}.shell{min-width:0}

.brand-image{width:96px;max-width:96px;height:38px;object-fit:contain}
.nav-title:after{content:"♟";float:right;color:#a855f7;font-size:12px}.sidebar-menu-title{font-weight:800}

/* V4: hard containment for tool thumbnails in the left selector */
#sidenav{overflow-x:hidden}#sidenav .nav-link{overflow:hidden;position:relative}#sidenav .nav-icon{width:29px!important;height:29px!important;min-width:29px!important;max-width:29px!important;min-height:29px!important;max-height:29px!important;overflow:hidden!important;position:relative}#sidenav .nav-icon>img.nav-thumb{display:block!important;position:absolute!important;inset:0!important;width:29px!important;height:29px!important;min-width:29px!important;max-width:29px!important;min-height:29px!important;max-height:29px!important;object-fit:cover!important;border-radius:8px!important;transform:none!important}.nav-label{min-width:0;flex:1}.nav-link>small{flex:none}
.nav-link>small[style]{background:var(--tag-color)!important;color:#fff!important;border-radius:999px!important;padding:4px 7px!important;box-shadow:0 4px 12px color-mix(in srgb,var(--tag-color) 32%,transparent)}
/* V4: header geometry matched to supplied reference */
.topline{height:40px!important;padding:0 22px!important;gap:23px!important;font-size:12px!important}.topline>span{display:flex;align-items:center}.topline .top-spacer{flex:1}.topline .top-clock{color:#ff4d67;margin-right:6px}.topline .top-shield{color:#4588ff;margin-right:7px}.topline .top-theme{margin-left:0!important;color:#65758e!important;padding:0 8px;display:grid;place-items:center}.topline .top-divider{display:block;width:1px;height:18px;background:var(--line)}.topline button[data-view="deposit"]{margin-left:0!important;display:flex;align-items:center;gap:5px}
header{height:65px!important;padding:0 30px!important;position:relative}.header-nav{gap:19px!important}.header-nav>a{display:flex;align-items:center;gap:8px}.home-icon{color:#f04667}.history-icon{color:#ff3159}.dropdown>button{height:40px;padding:0 13px!important;gap:8px!important}.dropdown-icon{display:grid;place-items:center;width:18px;height:18px;overflow:hidden;border-radius:5px}.dropdown-icon img{display:block!important;width:18px!important;height:18px!important;object-fit:cover!important;border-radius:5px}.dropdown-icon .ui-icon{width:17px;height:17px}.dropdown-chevron{width:14px!important;height:14px!important;margin-left:1px}.header-nav small{color:#fff!important;background:linear-gradient(135deg,#ff3d72,#b92bd7)!important;border-radius:999px!important;padding:3px 7px!important}.header-actions{width:285px;flex:none;justify-content:flex-end;margin-left:0}.header-actions>.moon{width:38px;height:38px;padding:0!important;display:grid;place-items:center;border-radius:12px}.wallet-pill,.user-pill{height:40px}.wallet-pill{padding:0 11px}.user-pill{padding:0 9px}.header-avatar{width:32px;height:32px}.account-actions{gap:8px}
@media(max-width:1100px){.header-actions{width:auto}.topline span:nth-child(3){display:none}}@media(max-width:850px){.topline{height:34px!important}.topline .top-theme,.topline .top-divider{display:none}.header-nav{margin-left:auto}.header-actions{width:auto}}
/* V4: all dark-surface text changes from black to white */
.dark body,.dark .hero h1,.dark .header-nav a,.dark .topline,.dark .side-user-copy b,.dark .side-user-copy small,.dark .nav-link,.dark footer,.dark .user-pill,.dark .wallet-pill{color:#f8fafc}.dark .header-nav a:first-child,.dark .home-icon,.dark .history-icon{color:#ff5574}.dark .wallet-pill{background:#2a2030;border-color:#563041}.dark .admin-pill{background:#172b4d;border-color:#31538a}.dark .user-pill,.dark .moon{background:#232a39;border-color:#343d50}.dark .topline,.dark header,.dark aside{background:#191f2e}.dark .dropdown>button{background:#2b233e;color:#d9b8ff}.dark .side-user-copy em,.dark .wallet-pill b{color:#fff}.dark .announcement{color:#f8fafc}.dark .announce-copy p{color:#e5e7eb}.dark .nav-title,.dark .brand-sub{color:#b4bed0}

/* V6: crisp SVG icons with the same stroke weight across browsers */
.ui-icon{display:inline-block;width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px}
.nav-icon .ui-icon{width:17px;height:17px}.nav-link.active .nav-icon .ui-icon{stroke-width:2.25}.topline .ui-icon{width:14px;height:14px}.topline .top-theme .ui-icon{width:16px;height:16px}.header-nav .home-icon{width:17px;height:17px;fill:currentColor;stroke-width:1.8}.header-nav .history-icon{width:19px;height:19px}.moon .ui-icon{width:18px;height:18px}.theme-switch>.ui-icon{width:17px;height:17px;color:#efa928}.wallet-pill>.ui-icon{width:16px;height:16px;color:#f59e0b}.wallet-pill>.plus-icon{width:17px;height:17px;color:var(--accent)}.account-chevron{width:13px!important;height:13px!important;color:#8290a6}.logout-button .ui-icon,.icon-button .ui-icon{width:16px;height:16px}.icon-button{display:flex;align-items:center;justify-content:center;gap:7px}.dropdown-list>a,.dropdown-list>span{display:flex!important;align-items:center;gap:9px;padding:13px;border-radius:9px;font-size:12px}.dropdown-list .ui-icon{width:17px;height:17px;color:var(--accent)}
.eyebrow .ui-icon{width:14px;height:14px;color:#f59e0b;fill:#f59e0b}.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:#f3a047}.hero-links .pill{display:inline-flex;align-items:center;gap:7px}.hero-links .pill>.ui-icon:first-child{width:17px;height:17px;padding:2px;border-radius:50%;color:#f59e0b;background:#fff1cf}.hero-links .pill:nth-child(2)>.ui-icon:first-child{color:#10b981;background:#dff8ee}.hero-links .pill-arrow{width:13px;height:13px;color:#a7afbb}.announce-icon .ui-icon{width:23px;height:23px}.announce-top>a{display:flex;align-items:center;gap:3px}.announce-top>a .ui-icon{width:13px;height:13px}.mini-cta{display:flex;align-items:center;justify-content:center;gap:5px}.mini-cta .ui-icon{width:13px;height:13px}.tool-cta>span{display:flex;align-items:center;gap:7px}.tool-cta .ui-icon{width:17px;height:17px}.tool-placeholder .ui-icon{width:38px;height:38px}.contact{display:flex;align-items:center;gap:6px}.contact .ui-icon{width:16px;height:16px}
@media(max-width:580px){.dropdown>button:after{content:none}.dropdown>button .dropdown-icon{display:grid}.dropdown>button .dropdown-chevron,.dropdown>button small{display:none}}

/* V7: two realtime system statistics panels */
.live-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:18px}.live-panel{min-width:0;overflow:hidden;border:1px solid #dfe6ee;border-radius:21px;background:var(--panel);box-shadow:0 12px 28px #25334d17}.live-head{height:64px;display:flex;align-items:center;gap:11px;padding:10px 18px;border-bottom:1px solid var(--line)}.usage-panel .live-head{background:linear-gradient(100deg,#fff8e9,var(--panel) 52%)}.deposit-panel .live-head{background:linear-gradient(100deg,#eafbf5,var(--panel) 52%)}.live-head-icon{width:34px;height:34px;display:grid;place-items:center;flex:none;border-radius:10px;color:#f59e0b;background:#ffedc7;box-shadow:0 3px 10px #f59e0b18}.deposit-panel .live-head-icon{color:#0ebc91;background:#cdf4e8}.live-head-icon .ui-icon{width:18px;height:18px}.live-head>div{min-width:0}.live-head h2{margin:0 0 3px;font-size:14px;font-weight:900;letter-spacing:.01em;color:var(--text)}.live-head p{margin:0;color:#93a1b5;font-size:10px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.realtime-badge{display:inline-flex;align-items:center;gap:6px;margin-left:auto;flex:none;padding:5px 9px;border:1px solid #a6e5d4;border-radius:999px;color:#059c78;background:#effcf8;font-size:9px;font-weight:900;letter-spacing:.05em}.realtime-badge i{width:7px;height:7px;border-radius:50%;background:#10b98c;box-shadow:0 0 0 4px #10b98c12;animation:livePulse 1.7s ease-in-out infinite}@keyframes livePulse{50%{opacity:.45;transform:scale(.8)}}.live-table-wrap{max-height:275px;overflow:auto;scrollbar-width:thin;scrollbar-color:#c6cfdd transparent}.live-table{width:100%;min-width:650px;table-layout:fixed;border-collapse:collapse;font-size:11px}.live-table thead{position:sticky;top:0;z-index:2;background:#f7f9fc}.live-table th{padding:10px 15px;color:#91a0b4;background:#f7f9fc;font-size:10px;font-weight:850;letter-spacing:.025em;text-align:left}.live-table td{height:49px;padding:8px 15px;border-top:1px solid #e8edf3;color:var(--text);vertical-align:middle}.live-table th:first-child,.live-table td:first-child{width:24%}.live-table th:nth-child(2),.live-table td:nth-child(2){width:48%}.live-table th:nth-child(3),.live-table td:nth-child(3){width:15%;text-align:right}.live-table th:nth-child(4),.live-table td:nth-child(4){width:13%;text-align:right;white-space:nowrap}.deposit-panel .live-table th:nth-child(2),.deposit-panel .live-table td:nth-child(2){width:43%}.deposit-panel .live-table th:nth-child(3),.deposit-panel .live-table td:nth-child(3){width:20%}.deposit-panel .live-table th:nth-child(4),.deposit-panel .live-table td:nth-child(4){width:13%}.feed-member{display:flex;align-items:center;gap:8px;min-width:0}.feed-member b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.feed-avatar{width:24px;height:24px;display:grid;place-items:center;flex:none;border-radius:50%;color:#fff;background:#ff9825;font-size:10px;font-style:normal;font-weight:900}.feed-avatar.deposit{background:#12bfa0}.service-name{display:flex;align-items:center;gap:5px;font-size:11px;line-height:1.25}.service-name .ui-icon{width:15px;height:15px;color:#7b45c8}.live-table td small{display:block;margin-top:3px;color:#9aa9bd;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.amount-out{color:#ff315b;font-size:10px;font-weight:750}.amount-in{color:#00a77c;font-size:10px;font-weight:750}.live-table time{color:#9aa9bd;font-size:9px}.method-badge{display:inline-flex;align-items:center;gap:4px;max-width:100%;padding:4px 7px;border-radius:7px;color:#2878ee;background:#eaf2ff;font-size:9px;font-weight:750;white-space:nowrap}.method-badge.card-method{color:#b2660b;background:#fff2d9}.method-badge .ui-icon{width:12px;height:12px}.live-empty{text-align:center!important;color:#98a5b8!important;height:90px!important;font-size:11px!important}
.dark .live-panel{border-color:#2d3749;box-shadow:0 12px 30px #0004}.dark .usage-panel .live-head{background:linear-gradient(100deg,#302819,var(--panel) 56%)}.dark .deposit-panel .live-head{background:linear-gradient(100deg,#17372f,var(--panel) 56%)}.dark .live-table thead,.dark .live-table th{background:#151b28}.dark .live-table td{border-color:#2a3344}.dark .live-head h2,.dark .live-table td,.dark .feed-member b,.dark .service-name{color:#f8fafc}.dark .method-badge{background:#1d3150;color:#7eb2ff}.dark .method-badge.card-method{background:#3a2d1b;color:#ffd28a}.dark .realtime-badge{background:#17372f;border-color:#286b5a;color:#5fe2bd}
@media(max-width:1250px){.live-grid{grid-template-columns:1fr}.live-table-wrap{max-height:260px}}@media(max-width:580px){.live-grid{gap:12px}.live-head{padding:9px 12px}.live-head p{max-width:190px}.realtime-badge{padding:4px 7px;font-size:8px}.live-table th,.live-table td{padding-left:12px;padding-right:12px}}

/* V8: mobile width lock and compact realtime layout */
.mobile-row-meta{display:none}
@media(max-width:850px){
 html,body{width:100%;max-width:100%;overflow-x:hidden}
 .shell{width:100%!important;max-width:100%!important;margin-left:0!important;overflow-x:hidden}
 main,.hero,.announcement,.tool-grid,.tool-card,.live-grid,.live-panel{width:100%;max-width:100%;min-width:0}
 header{width:100%;max-width:100%;padding:0 12px!important;gap:8px!important;justify-content:flex-start!important;overflow:visible}
 .hamburger{width:30px;height:38px;padding:0;display:grid!important;place-items:center;flex:none}
 .mobile-brand{display:block!important;flex:1;min-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px!important}
 .header-nav{margin:0!important;gap:0!important;flex:none}
 .header-nav>a{display:none!important}
 .header-nav .dropdown{display:block}
 .dropdown>button{width:36px!important;height:36px!important;padding:0!important;display:grid!important;place-items:center!important;font-size:0!important}
 .dropdown>button .dropdown-icon{display:grid!important}
 .dropdown>button small,.dropdown>button .dropdown-chevron{display:none!important}
 .header-actions{width:auto!important;min-width:0;gap:6px!important;flex:none}
 .header-actions>.moon{width:36px!important;height:36px!important;flex:none}
 .account-actions{gap:6px!important}
 .wallet-pill,.user-pill{width:38px;height:38px;padding:0!important;justify-content:center;overflow:hidden}
 .wallet-pill>span,.wallet-pill>.plus-icon,.user-pill>span,.user-pill>.account-chevron{display:none!important}
 .wallet-pill>.ui-icon{width:17px;height:17px}
 .header-avatar{width:30px;height:30px}
 .topline{width:100%;max-width:100%;padding:0 14px!important;gap:8px!important;overflow:hidden}
 .topline>span:first-child{overflow:hidden;text-overflow:ellipsis}
 .topline button[data-view="deposit"]{flex:none}
 main{padding:26px 14px 42px!important}
 .contact-wrap{right:12px!important}
}
@media(max-width:580px){
 .hero{padding-top:4px}.hero h1{font-size:26px!important}
 .announcement{padding:16px!important}.announce-copy{min-width:0}
 .tool-card{width:100%;max-width:100%;padding:14px!important}
 .live-head{height:62px;padding:8px 11px!important;gap:8px}.live-head-icon{width:32px;height:32px}.live-head p{display:none}.live-head h2{font-size:13px}.realtime-badge{margin-left:auto;padding:4px 7px!important}
 .live-table-wrap{width:100%;max-height:265px;overflow-x:hidden}
 .live-table{width:100%!important;min-width:0!important;table-layout:fixed}
 .live-table th,.live-table td{padding:8px 10px!important}
 .live-table th:first-child,.live-table td:first-child{width:39%!important}
 .live-table th:nth-child(2),.live-table td:nth-child(2),.deposit-panel .live-table th:nth-child(2),.deposit-panel .live-table td:nth-child(2){width:61%!important}
 .live-table th:nth-child(3),.live-table td:nth-child(3),.live-table th:nth-child(4),.live-table td:nth-child(4){display:none}
 .mobile-row-meta{display:block;margin-top:3px;color:#9aa9bd;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .feed-member{gap:6px}.feed-member b{font-size:10px}.feed-avatar{width:22px;height:22px}
 .service-name{font-size:10px}.method-badge{max-width:100%;overflow:hidden;text-overflow:ellipsis}
}
@media(max-width:390px){.header-actions>.moon{display:none}.mobile-brand{font-size:15px!important}.hero-links{flex-wrap:wrap}}

/* V8: ảnh icon riêng cho từng danh mục Tool */
.tool-item-icon{display:block;flex:none;object-fit:cover;border-radius:6px}
.icon-fallback{display:grid;place-items:center;line-height:1}
.dropdown-tool-icon{width:24px;height:24px}
.header-tool-icon{width:20px;height:20px;border-radius:5px}
.dropdown-icon{overflow:hidden}
.dropdown-list>a>span:last-child,.dropdown-list>span>span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tool-copy h2{display:flex;align-items:flex-start;gap:7px}
.card-tool-icon{width:21px;height:21px;margin-top:0}
.card-tool-icon.icon-fallback{font-size:16px}
@media(max-width:580px){.card-tool-icon{width:19px;height:19px}.header-tool-icon{width:19px;height:19px}}

/* V10: đồng bộ font chữ đậm toàn bộ giao diện */
.home-logo-wrap{width:40px;height:40px;border:1px solid var(--line);border-radius:11px;background:var(--bg);display:grid;place-items:center;overflow:hidden;flex:0 0 auto}.home-logo{max-width:36px;max-height:36px;object-fit:contain}.home-logo-dark{display:none!important}.dark .home-logo-light{display:none!important}.dark .home-logo-dark{display:block!important}.home-mobile-logo{max-width:118px;max-height:38px;object-fit:contain}.mobile-brand:has(.home-mobile-logo){height:40px;align-items:center}
body{font-family:Inter,'Segoe UI',Arial,sans-serif!important;font-weight:600!important;letter-spacing:-.01em}
button,input,textarea,select{font-family:inherit!important;font-weight:650!important}
h1,h2,h3,h4,h5,h6,strong,b{font-weight:800!important}
.brand,.mobile-brand,.hero h1,.tool-copy h2,.tool-cta,.primary{font-weight:900!important}
.nav-link,.header-nav a,.dropdown>button,.pill,.theme-switch,.user-pill,.wallet-pill,label,th{font-weight:800!important}
.topline,.announce-copy,.tool-copy p,td,.muted,.section-heading p,small{font-weight:600!important}
.brand-image-only{height:104px;justify-content:center;padding:8px 12px}.brand-image-only .home-logo-wrap{width:88px;height:88px;border:0;background:transparent;border-radius:0;overflow:hidden}.brand-image-only .home-logo{display:block;width:80px!important;height:80px!important;max-width:80px!important;max-height:80px!important;margin:auto;object-fit:contain;object-position:center}
