:root{
  --primary:#2557f5;--primary-light:#5b7cfa;--primary-dark:#173eb8;--primary-wash:rgba(37,87,245,.09);
  --accent:#ff6b5e;--accent-wash:rgba(255,107,94,.12);--success:#22b889;--success-wash:rgba(34,184,137,.12);
  --bg-app:#f6f7f9;--bg-surface:#fff;--bg-surface-2:#fbfaf7;--bg-glass:rgba(255,255,255,.88);
  --text-main:#0b1221;--text-muted:#536177;--text-faint:#8490a3;--border-light:rgba(11,18,33,.08);--border-strong:rgba(11,18,33,.15);
  --radius-sm:8px;--radius-md:12px;--radius-lg:16px;
}
[data-theme="dark"]{--bg-app:#070b14;--bg-surface:#101725;--bg-surface-2:#0c121e;--bg-glass:rgba(16,23,37,.9);--text-main:#f4f7fb;--text-muted:#a8b3c7;--text-faint:#748197;--border-light:rgba(255,255,255,.08);--border-strong:rgba(255,255,255,.16)}
body{font-size:15px;overflow-x:hidden}.sidebar{padding:16px 12px;border-color:var(--border-light)}.s-brand{font-size:17px}.s-brand .lg{background:var(--text-main);transform:none;box-shadow:none}.s-link{min-height:44px;border-radius:9px}.s-link.active{background:var(--primary);color:#fff}.s-link.active svg{color:#fff}.s-user{border-radius:11px}.topbar{background:var(--bg-glass);height:70px}.content{padding:30px;max-width:1320px}.view{animation-duration:.24s}.page-head h1{font-size:30px;letter-spacing:-.04em}.page-head p{font-size:15px}.btn{min-height:44px;border-radius:10px}.btn-primary{background:var(--primary);box-shadow:0 8px 22px rgba(37,87,245,.22)}.btn-primary:hover{background:var(--primary-dark)}.card,.tile{border-radius:14px;box-shadow:none}.card:hover,.tile:hover{border-color:rgba(37,87,245,.22)}.tile{padding:20px}.t-ic,.tm-ic,.ri{border-radius:9px}.t-val{letter-spacing:-.04em}.seg{border-radius:9px}.seg button{min-height:35px;border-radius:7px}.tool-mini{border-radius:11px}.pill{border-radius:7px}.ring{background:conic-gradient(var(--rc) calc(var(--v)*1%),rgba(11,18,33,.08) 0)}
.welcome-banner{position:relative;overflow:hidden;margin:-2px 0 18px;padding:22px 24px;border:1px solid rgba(37,87,245,.18);border-radius:15px;background:linear-gradient(110deg,rgba(37,87,245,.10),rgba(34,184,137,.08));display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center}.welcome-banner::after{content:"";position:absolute;width:160px;height:160px;right:21%;top:-116px;border:32px solid rgba(37,87,245,.09);border-radius:50%}.welcome-banner h2{font-size:18px;letter-spacing:-.02em}.welcome-banner p{margin-top:5px;color:var(--text-muted);font-size:13px}.welcome-banner .btn{position:relative;z-index:1}.activation-panel{margin-bottom:18px;padding:18px;border:1px solid var(--border-light);border-radius:15px;background:var(--bg-surface);display:grid;grid-template-columns:auto repeat(3,1fr);align-items:center;gap:12px}.activation-panel>div:first-child{padding-right:18px}.activation-panel h3{font-size:14px}.activation-panel>div:first-child p{margin-top:3px;color:var(--text-faint);font-size:11px}.activation-task{min-height:64px;padding:11px;border:1px solid var(--border-light);border-radius:10px;display:flex;align-items:center;gap:10px;cursor:pointer}.activation-task:hover{border-color:var(--primary)}.activation-task span{width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:var(--primary-wash);color:var(--primary);font:700 10px var(--font-mono)}.activation-task b,.activation-task small{display:block}.activation-task b{font-size:11px}.activation-task small{margin-top:3px;color:var(--text-faint);font-size:10px}
.plan-ladder{margin-bottom:18px}.plan-ladder-head{display:flex;align-items:flex-start;justify-content:space-between;gap:26px;margin-bottom:26px}.plan-ladder-head .eyebrow{display:block;margin-bottom:7px;color:var(--primary);font-size:10px;font-weight:850;letter-spacing:.12em}.plan-ladder-head h3{font-size:20px;letter-spacing:-.025em}.plan-ladder-head p{max-width:640px;margin-top:6px;color:var(--text-muted);font-size:13px}.current-plan-chip{padding:7px 10px;border-radius:8px;background:var(--primary-wash);color:var(--primary);font-size:11px;white-space:nowrap}.plan-rail{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border-light);border-radius:13px;overflow:hidden}.plan-node{position:relative;min-height:228px;padding:20px;border-right:1px solid var(--border-light)}.plan-node:last-child{border:0}.plan-node>span{font:700 10px var(--font-mono);color:var(--text-faint)}.plan-node h4{margin:25px 0 7px;font-size:17px}.plan-node strong{font:700 21px var(--font-mono)}.plan-node strong small{font-size:10px;color:var(--text-faint)}.plan-node p{margin:11px 0 18px;color:var(--text-muted);font-size:11px;line-height:1.6}.plan-node a,.plan-node button{display:inline-flex;min-height:36px;padding:0 11px;align-items:center;border:1px solid var(--border-strong);border-radius:8px;background:transparent;color:var(--text-main);font:750 11px var(--font-sans);text-decoration:none;cursor:pointer}.plan-node a:hover{border-color:var(--primary);color:var(--primary)}.plan-node.current{background:var(--primary);color:#fff}.plan-node.current>span,.plan-node.current p{color:rgba(255,255,255,.66)}.plan-node.current button{border-color:rgba(255,255,255,.2);color:#fff;cursor:default}.plan-node.recommended::after{content:"TIẾP THEO";position:absolute;top:15px;right:15px;padding:4px 6px;border-radius:5px;background:rgba(34,184,137,.12);color:#087759;font-size:8px;font-weight:900;letter-spacing:.08em}.new-user .tile .spark{opacity:.24}.sample-chip{margin-left:10px}.plan-lock{margin:10px 18px 18px;padding:16px;border:1px solid rgba(37,87,245,.18);border-radius:11px;background:linear-gradient(100deg,var(--primary-wash),var(--success-wash));display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px}.plan-lock>span{padding:5px 7px;border-radius:6px;background:var(--primary);color:#fff;font:800 9px var(--font-mono)}.plan-lock b{font-size:13px}.plan-lock p{margin-top:3px;color:var(--text-muted);font-size:11px}.plan-lock a{color:var(--primary);font-size:11px;font-weight:800}.locked-card .table-wrap{filter:blur(2px);opacity:.42;pointer-events:none;max-height:145px;overflow:hidden}
@media(max-width:1100px){.g-4{grid-template-columns:repeat(2,1fr)}.content .grid[style*="1fr 320px"],.content .grid[style*="1.4fr 1fr"],.content .grid[style*="1fr 340px"]{grid-template-columns:1fr!important}.activation-panel{grid-template-columns:1fr 1fr}.activation-panel>div:first-child{grid-column:1/-1}.plan-rail{grid-template-columns:1fr 1fr}.plan-node:nth-child(2){border-right:0}.plan-node:nth-child(-n+2){border-bottom:1px solid var(--border-light)}}
@media(max-width:760px){.app{grid-template-columns:1fr}.topbar{padding:0 14px;gap:8px}.topbar .role-switch,.topbar .lang-wrap{display:none}.tb-crumb{font-size:10px}.tb-title{font-size:16px}.content{padding:20px 14px}.page-head{align-items:flex-start;gap:14px}.page-head h1{font-size:26px}.page-head>.btn{width:100%}.g-4,.g-3,.g-2{grid-template-columns:1fr!important}.content .grid[style]{grid-template-columns:1fr!important}.stats-grid{grid-template-columns:1fr}.tool-layout{grid-template-columns:1fr}.tool-hero{align-items:flex-start}.tool-hero>.btn{display:none}.seg{max-width:100%;overflow-x:auto;justify-content:flex-start}.tbl{min-width:680px}.welcome-banner{grid-template-columns:1fr;padding:20px}.welcome-banner .btn{width:100%}.activation-panel{grid-template-columns:1fr}.activation-panel>div:first-child{grid-column:auto}.plan-ladder-head{flex-direction:column}.plan-rail{grid-template-columns:1fr}.plan-node{min-height:0;border-right:0;border-bottom:1px solid var(--border-light)!important}.plan-node:last-child{border-bottom:0!important}.plan-node h4{margin-top:16px}.plan-node p{margin-bottom:13px}.topbar .icon-btn{flex:0 0 auto}.s-user{margin-bottom:8px}.plan-lock{grid-template-columns:auto 1fr}.plan-lock a{grid-column:1/-1}}
@media(max-width:420px){.topbar .icon-btn:not(.hamburger):not(#theme-btn){display:none}.content{padding-inline:12px}.page-head{display:block}.page-head>.btn{margin-top:14px}.tile{padding:17px}.card.pad{padding:17px}.ring-wrap{flex-direction:column;align-items:stretch}.activation-task{min-height:58px}}
.role-switch{display:none}.admin-preview .role-switch{display:flex}.content .grid,.content .grid>*{min-width:0}.table-wrap{width:100%;max-width:100%}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Scalable product navigation */
.sidebar{overflow:hidden}.s-nav{display:flex;flex:1;min-height:0;flex-direction:column;gap:4px;margin:2px -5px 8px 0;padding-right:5px;overflow-y:auto;scrollbar-width:thin}.s-nav-section{display:flex;flex-direction:column;gap:3px}.s-nav-section+.s-nav-section{margin-top:7px}.s-nav .s-sec{padding:11px 10px 5px}.s-sec-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.s-sec-row>span:last-child{font-size:8px;letter-spacing:.04em;text-transform:none;color:var(--success)}.s-nav .s-link{width:100%;border:0;background:transparent;text-align:left;font-family:inherit}.s-nav .s-link:hover{background:var(--bg-surface-2)}.s-nav .s-link.active{background:var(--primary);color:#fff}.s-nav .s-link.active svg{color:#fff}.s-link-compact{min-height:44px!important}.s-count{margin-left:auto;min-width:24px;padding:2px 6px;border-radius:6px;background:var(--bg-surface-2);color:var(--text-faint);font:700 9px var(--font-mono);text-align:center}.s-link.active .s-count{background:rgba(255,255,255,.15);color:#fff}.s-pin{margin-left:auto;color:#f5a524;font-size:12px}.s-product-nav{display:flex;flex-direction:column;gap:3px}.s-product-link{padding-left:10px}.s-product-link .product-dot{width:8px;height:8px;border:2px solid currentColor;border-radius:3px;opacity:.62}.s-product-link.is-filtered{background:var(--primary-wash);color:var(--primary)}.s-upgrade-card{display:none;width:100%;min-height:66px;margin:4px 0 10px;padding:11px;border:1px solid rgba(37,87,245,.17);border-radius:11px;background:linear-gradient(120deg,rgba(37,87,245,.09),rgba(34,184,137,.08));color:var(--text-main);font-family:inherit;text-align:left;cursor:pointer;align-items:center;gap:10px}.s-upgrade-card:hover{border-color:rgba(37,87,245,.38)}body[data-plan="free"] .s-upgrade-card{display:flex}.s-upgrade-icon{width:30px;height:30px;display:grid;place-items:center;flex:0 0 auto;border-radius:8px;background:var(--primary);color:#fff;font-weight:800}.s-upgrade-card b,.s-upgrade-card small{display:block}.s-upgrade-card b{font-size:12px}.s-upgrade-card small{max-width:150px;margin-top:2px;color:var(--text-muted);font-size:9px;line-height:1.35}.s-spacer{display:none}.s-user{flex:0 0 auto}.icon-btn{width:44px;height:44px}.lang-btn{height:44px}.seg button{min-height:44px}#view-qr input[type="color"]{min-height:44px}

.sidebar-backdrop{display:none}
@media(max-width:760px){.sidebar{padding-bottom:10px}.s-nav{margin-bottom:6px}.s-upgrade-card{min-height:58px}.s-upgrade-card small{font-size:8px}.s-user{margin-bottom:0}.sidebar-backdrop{display:block;position:fixed;inset:0;z-index:25;border:0;background:rgba(11,18,33,.42);opacity:0;pointer-events:none;transition:opacity .2s}.sidebar.open+.sidebar-backdrop{opacity:1;pointer-events:auto}}