:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:#172941;background:#f5f7fb;font-size:14px}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:#196fa5;text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3{letter-spacing:-.035em}h1{font-size:2.1rem;margin:8px 0}h2{font-size:1.6rem}h3{font-size:1.1rem}.muted{color:#687a91}.small{font-size:.82rem}.eyebrow,.sidebar-title{font-size:.72rem;letter-spacing:.17em;font-weight:750;color:#7b8a9f}.login-wrap{display:grid;grid-template-columns:50% 50%;min-height:100vh;background:#fff}.login-card{width:min(460px,80%);margin:auto}.login-card label,.form-grid label{display:block;margin:19px 0 14px;font-size:.88rem;font-weight:650}.login-card input,.form-grid input,.form-grid select,.form-grid textarea,.form-grid select,.input{display:block;width:100%;padding:13px 14px;margin-top:8px;border:1px solid #d7dfeb;border-radius:10px;background:#fff;outline:none;color:#182b43}.login-card input:focus,.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{border-color:#387cad;box-shadow:0 0 0 3px #d7eaf8}.primary{background:#1f6596;color:white;border:1px solid #1f6596;border-radius:10px;padding:12px 18px;font-weight:700}.primary:hover{background:#164f78}.primary:disabled{opacity:.55;cursor:not-allowed}.secondary{background:#fff;border:1px solid #d5deea;border-radius:10px;color:#28445e;padding:11px 16px;font-weight:650}.secondary:hover{background:#eef4fa}.danger{color:#a7333b;background:#fff;border:1px solid #f0c4c6;padding:8px 11px;border-radius:8px}.ghost{border:0;background:transparent;color:#95b4d0;font-weight:700}.login-card .primary{width:100%;display:flex;justify-content:space-between;margin-top:24px}.mark{background:#286f9f;width:47px;height:47px;border-radius:14px;color:white;display:grid;place-items:center;font-weight:900;font-size:28px;box-shadow:0 8px 25px #1f67952a;margin-bottom:21px}.small-mark{width:34px;height:34px;font-size:19px;border-radius:9px;margin:0}.login-card h1 span{color:#2b7ea6}.login-side{background:#12314c;color:#fff;padding:clamp(55px,10vw,170px) 13%;position:relative;overflow:hidden}.login-side:before{content:"";position:absolute;width:480px;height:480px;right:-220px;bottom:-190px;border:70px solid #ffffff12;border-radius:50%}.login-tag{font-weight:800;font-size:.72rem;letter-spacing:.16em;color:#8fcbe5}.login-side h2{font-size:clamp(2.8rem,4.7vw,5.3rem);line-height:1.06;margin:25px 0}.login-side p{line-height:1.9;color:#a8c2d6;max-width:410px}.login-illustration{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;max-width:450px;margin-top:65px}.login-illustration div{background:#ffffff14;border:1px solid #ffffff17;padding:21px;border-radius:13px;text-align:center;font-weight:700}#app{display:flex;min-height:100vh}.sidebar{width:252px;background:#122c44;color:#cedce8;display:flex;flex-direction:column;padding:21px 14px 16px;flex-shrink:0;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:10px;margin:0 8px 44px}.brand strong{display:block;color:#fff;font-size:1.18rem}.brand small{display:block;margin-top:3px;color:#91acbf;font-size:.72rem}.sidebar-title{margin:0 14px 12px;color:#8ba9bd}#nav{display:grid;gap:4px}#nav button{width:100%;text-align:left;background:transparent;border:0;border-radius:9px;color:#c1d5e2;padding:12px 13px;font-weight:580}#nav button span{margin-right:13px;font-size:1.1rem}#nav button:hover,#nav button.selected{background:#ffffff17;color:white}#nav button.selected{box-shadow:inset 3px 0 #58b7de}.sidebar-bottom{margin-top:auto;border-top:1px solid #ffffff20;padding:18px 10px 3px}.sidebar-bottom .ghost{margin-top:14px;padding:0}.user-name{font-weight:800;color:#fff}.user-role{display:block;font-size:.77rem;color:#9ab6ca;margin-top:4px}.main-panel{flex:1;min-width:0}.topbar{height:64px;border-bottom:1px solid #e6edf2;background:white;display:flex;align-items:center;justify-content:space-between;padding:0 36px;color:#425e77;font-weight:700}.topbar-right{font-weight:500;color:#608777;font-size:.83rem}.status-dot{display:inline-block;width:8px;height:8px;background:#32ab87;border-radius:50%;margin-right:5px}.content{max-width:1220px;margin:auto;padding:38px 36px 60px}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:28px}.page-head h1{font-size:1.9rem;margin:4px 0 6px}.page-head p{color:#6e7c8e;margin:0}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.card{background:#fff;border:1px solid #e4eaf1;border-radius:14px;padding:23px;box-shadow:0 4px 12px #243e5509}.card h3{margin:0 0 9px}.stat-value{font-size:2.05rem;font-weight:800;letter-spacing:-.035em}.stat-label{font-size:.88rem;color:#708197;margin-top:6px}.card-cta{display:flex;justify-content:space-between;align-items:center;gap:10px}.card-cta button{white-space:nowrap}.section{margin-top:25px}.section h2{font-size:1.16rem;margin-bottom:15px}.table-wrap{background:#fff;border:1px solid #e4eaf1;border-radius:14px;overflow:auto}table{border-collapse:collapse;width:100%}th{text-align:left;font-size:.76rem;letter-spacing:.04em;color:#70829b;background:#f8fafd;padding:14px}td{border-top:1px solid #edf1f6;padding:13px 14px;font-size:.89rem;vertical-align:top}.pill{display:inline-block;border:1px solid #dfebf3;border-radius:99px;padding:4px 9px;font-size:.76rem;color:#32658e;background:#edf6fc}.pill.warn{background:#fff7e8;border-color:#f4dfb1;color:#94662b}.pill.good{background:#ecf9f4;border-color:#c5ebdf;color:#197959}.pill.bad{background:#fff1f1;border-color:#f1cece;color:#ae3434}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}.form-grid .full{grid-column:1/-1}.callout{background:#edf5fa;border:1px solid #d7eaf6;border-radius:12px;padding:15px 17px;color:#365978;line-height:1.75}.muted-note{font-size:.81rem;color:#788697;line-height:1.6}.report-head{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.report-metric{padding:19px;border-radius:12px;background:#f6f9fc;border:1px solid #e3eaf1}.report-metric strong{display:block;font-size:1.7rem;margin:5px 0}.comparison{border:1px solid #e2e9f0;border-radius:10px;margin-top:14px;overflow:hidden}.comparison .meta{padding:11px 15px;background:#f4f7fb;font-weight:650;color:#4d617b}.comparison .twocol{display:grid;grid-template-columns:1fr 1fr;gap:0}.comparison .twocol>div{padding:15px;line-height:1.7;overflow-wrap:anywhere}.comparison .twocol>div:first-child{border-right:1px solid #e2e9f0}.comparison .twocol strong{font-size:.77rem;color:#667a91}.comparison p{margin:7px 0 0}.empty{padding:40px;text-align:center;color:#75849a}.actions{display:flex;gap:9px;flex-wrap:wrap;align-items:center}.top-actions{display:flex;gap:9px}.mobile-nav{display:none}.row-flex{display:flex;justify-content:space-between;align-items:center;gap:15px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:17px}.rubric-group{font-weight:800;color:#204a6f;background:#eff6fb}.loading{border:2px solid #bdd9ea;border-top:2px solid #1f6596;border-radius:50%;width:22px;height:22px;animation:spin .8s linear infinite;display:inline-block;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}#toast{position:fixed;bottom:22px;right:22px;z-index:50;display:none;max-width:500px;padding:17px 22px;color:#fff;background:#254661;border-radius:12px;box-shadow:0 18px 40px #0003;line-height:1.6}@media(max-width:990px){.grid,.report-head{grid-template-columns:repeat(2,1fr)}.sidebar{width:208px}.content{padding:27px 22px}.topbar{padding:0 22px}}@media(max-width:700px){.login-wrap{grid-template-columns:1fr}.login-side{display:none}.login-card{padding:50px 0}.sidebar{position:fixed;z-index:30;transform:translateX(-110%);transition:.2s;box-shadow:8px 0 30px #0002}.sidebar.open{transform:translateX(0)}.mobile-nav{display:inline-block;border:0;background:transparent;font-size:1.4rem;margin-right:12px}.topbar{justify-content:flex-start}.topbar-right{margin-left:auto}.grid,.report-head,.form-grid,.two-col,.comparison .twocol{grid-template-columns:1fr}.comparison .twocol>div:first-child{border-right:0;border-bottom:1px solid #e2e9f0}.content{padding:21px 15px}.page-head{flex-direction:column}.card{padding:17px}}

[hidden]{display:none!important}

/* UHDChecker V12.1: giao diện ảnh mẫu 1, trắng - xanh UHD - vàng. */
:root{--uhd-blue:#145ab7;--uhd-deep:#0d3172;--uhd-gold:#ffcc15;--uhd-white:#fff;color:#162949;background:#f2f7fd}
body{background:#f3f7fd}a{color:var(--uhd-blue)}
.sidebar{background:#fff;color:#1c396d;border-right:1px solid #dde7f5;width:245px;box-shadow:2px 0 16px #0f367008}
.brand{margin:6px 8px 28px;gap:10px}.brand strong{color:var(--uhd-deep);font-size:1.13rem}.brand small{color:#52749b;line-height:1.4;max-width:148px;font-size:.67rem}
.brand-logo{width:62px;height:62px;border-radius:50%;object-fit:contain;flex-shrink:0}
.sidebar-title{color:#6d84a0}#nav button{color:#254a7a;font-weight:600}#nav button:hover{background:#eef5ff;color:#124796}#nav button.selected{background:var(--uhd-blue);color:white;box-shadow:none}
.sidebar-bottom{border-top:1px solid #e4ebf4}.user-name{color:var(--uhd-deep)}.user-role{color:#587799}.sidebar-bottom .ghost{color:#24579c}
.main-panel{background:#f3f7fd}.topbar{min-height:80px;height:auto;background:white;border-bottom:1px solid #e0eaf6;padding:10px 35px}.topbar-brand{display:grid;gap:5px}.topbar-brand strong{font-size:1.05rem;color:var(--uhd-deep);letter-spacing:.03em}.topbar-brand span{font-size:.81rem;color:#59779d}
.content{max-width:1500px;padding:20px 22px 58px}.hero{border-radius:18px;background:linear-gradient(102deg,#e8f2ff 0%,#d9ebff 67%,#b9ddfd 100%);padding:35px 40px;min-height:220px;position:relative;overflow:hidden;border:1px solid #d3e4f7;margin-bottom:17px}.hero:before{content:'';position:absolute;width:400px;height:400px;right:-150px;top:-215px;border:75px solid #ffffff55;border-radius:50%}.hero:after{content:'';position:absolute;width:210px;height:410px;right:-105px;top:-110px;transform:rotate(32deg);background:linear-gradient(90deg,#ffd115,#f8b900);border-radius:50%;opacity:.9}.hero h1{font-size:clamp(1.4rem,2.25vw,2.45rem);color:#0b2e7c;line-height:1.17;max-width:780px;position:relative;z-index:1}.hero p{max-width:740px;color:#496a97;line-height:1.55;z-index:1;position:relative}.hero .eyebrow{color:#1b65b0}.hero-actions{display:flex;gap:10px;position:relative;z-index:1}.gold-btn{border:0;border-radius:11px;background:var(--uhd-gold);color:#063273;font-weight:800;padding:13px 22px}.gold-btn:hover{background:#f4bc00}
.primary{background:var(--uhd-blue);border-color:var(--uhd-blue)}.primary:hover{background:#084494}.login-wrap{grid-template-columns:50% 50%}.login-side{background:linear-gradient(140deg,#0d3b83,#1d67bc)}.login-side:before{border-color:#ffd31928}.login-card h1 span{color:var(--uhd-blue)}.system-name{font-size:1.2rem;color:var(--uhd-deep);line-height:1.4}.logo-login{width:100px;height:100px;border-radius:50%;object-fit:contain;margin-bottom:12px}
.stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.stat-grid .card{border:1px solid #e1eaf7;box-shadow:0 3px 8px #173f6a0a}.stat-grid .stat-value{color:var(--uhd-blue)}
.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.feature-tile{border:1px solid #dce7f4;border-radius:13px;background:white;padding:18px 16px;text-align:left;display:grid;gap:8px;color:#174477}.feature-tile:hover{border-color:#7eaee5;box-shadow:0 7px 24px #346baa17}.feature-tile span{font-size:1.6rem;color:#0e62b5}.feature-tile strong{font-size:.92rem}.feature-tile small{color:#627994;line-height:1.5}
.card{border-color:#e0eaf6}.report-metric{background:#f3f8ff}.review-layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr);gap:14px}.pdf-card{min-width:0}.pdf-card iframe{display:block;width:100%;height:670px;border:1px solid #d4e2f0;background:white;border-radius:8px}.issue-line{padding:10px 0;border-bottom:1px solid #edf1f8;line-height:1.6}.issue-line:last-child{border-bottom:0}
@media(max-width:1170px){.feature-grid{grid-template-columns:repeat(2,1fr)}.review-layout{grid-template-columns:1fr}}@media(max-width:700px){.feature-grid,.stat-grid{grid-template-columns:1fr}.hero{padding:22px}.hero h1{font-size:1.45rem}.topbar{padding:12px}.topbar-brand strong{font-size:.8rem}.topbar-brand span{font-size:.7rem}}
