/* BÉ NÂU SHOP – V7 / compact dark premium, responsive */
:root{
  color-scheme:dark;
  --bg:#08151d;--bg-deep:#061119;--surface:#101f2a;--surface-2:#132733;
  --raised:#172f3b;--line:#29434f;--line-soft:#1d3440;
  --text:#eaf5f8;--muted:#91a9b5;--cyan:#41cddd;--cyan-strong:#22bdd4;
  --gold:#ffc65a;--coral:#ff766c;--mint:#59ddb4;
  --r-xl:19px;--r-md:12px;--shadow:0 14px 36px rgba(0,0,0,.17)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;min-width:320px;font-family:'Be Vietnam Pro',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;font-size:13px;line-height:1.55;color:var(--text);font-weight:500;background:radial-gradient(ellipse 45vw 520px at 96% 0%,rgba(43,100,94,.16),transparent 80%),radial-gradient(ellipse 50vw 490px at 0% 30%,rgba(17,77,98,.11),transparent 84%),var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}.icon{display:inline-block;flex:0 0 auto;width:19px;height:19px;vertical-align:middle}.no-scroll,.popup-open{overflow:hidden}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.container{width:min(1190px,calc(100% - 42px));margin-inline:auto}
.page-shell{padding-bottom:95px;min-height:100vh}

/* Slim, editorial header */
.site-header{background:rgba(7,22,30,.73);border-bottom:1px solid rgba(104,173,189,.16);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);margin-bottom:22px}
.topbar{min-height:81px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 0}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.brand img{width:54px;height:54px;border:2px solid #557482;border-radius:50%;object-fit:cover;box-shadow:0 0 0 4px #122a36,0 6px 16px #0005;flex:0 0 auto}
.brand-text{display:flex;align-items:center;gap:9px;min-width:0}.brand-text strong{font-size:17px;line-height:1.15;font-weight:850;color:#78e1ea;letter-spacing:-.5px;white-space:normal;text-wrap:balance}
.brand-text>span{font-size:10px;letter-spacing:1.3px;font-weight:800;color:#fff;padding:3px 7px;border-radius:5px;background:#fc636c;white-space:nowrap}
.top-actions{display:flex;gap:8px;flex:0 0 auto}
.square-btn{width:43px;height:43px;display:flex;align-items:center;justify-content:center;border-radius:13px;text-decoration:none;border:1px solid #34515e;transition:background .2s,transform .2s,border-color .2s}
.square-btn .icon{width:18px;height:18px}.square-btn:hover{transform:translateY(-2px);border-color:var(--cyan)}
.square-btn.call{background:#152733;color:#e3eff5}.square-btn.zalo{background:linear-gradient(145deg,#28c6dc,#1598b3);color:#fff;border-color:#37d3e4}.square-btn.group{background:linear-gradient(145deg,#ffcf69,#ecad33);color:#102935;border-color:#f9cf72}
.zalo-wordmark{font-size:11px;font-weight:850;letter-spacing:-.2px}

/* Hero + trust */
.hero-card{border-radius:var(--r-xl);overflow:hidden;box-shadow:0 12px 37px #0004;border:1px solid #365965;background:#102432;position:relative}
.hero-card:after{content:"";pointer-events:none;position:absolute;inset:0;border:1px solid rgba(255,255,255,.05);border-radius:inherit}
.hero-card img{display:block;width:100%;height:auto;object-fit:contain}
.trust-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:15px 0 23px;padding:5px;background:linear-gradient(180deg,#122631,#10212b);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--shadow)}
.trust-item{display:flex;align-items:center;gap:11px;min-width:0;padding:15px 12px;border-right:1px solid var(--line-soft)}
.trust-item:last-child{border-right:0}.trust-icon{width:37px;height:37px;border:1px solid #315c68;border-radius:12px;background:rgba(61,204,224,.08);color:var(--cyan);display:grid;place-items:center;flex:0 0 auto}
.trust-icon .icon{width:20px;height:20px}.trust-item p,.footer-benefit p{min-width:0;margin:0}.trust-item b{display:block;font-size:10px;font-weight:800;letter-spacing:.35px;line-height:1.4;white-space:normal}.trust-item small{display:block;font-size:10px;color:var(--muted);line-height:1.45;margin-top:3px}

/* Search form */
.search-panel{border:1px solid var(--line);border-radius:var(--r-xl);padding:18px;background:linear-gradient(135deg,#132733,#0e202b);box-shadow:var(--shadow)}
.panel-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:15px;margin-bottom:14px}.eyebrow{color:var(--cyan);font-size:9px;letter-spacing:2px;font-weight:800}.panel-heading h2{margin:2px 0 0;font-size:18px;line-height:1.45;letter-spacing:-.55px;font-weight:800}.panel-tag{font-size:10px;color:var(--cyan);border:1px solid #306474;background:#173a46;border-radius:20px;padding:4px 10px;font-weight:800;white-space:nowrap}
.search-line{height:49px;display:flex;align-items:center;gap:10px;background:#0b1b26;border:1px solid #395563;border-radius:11px;padding:0 15px;color:#9dbcc8;transition:border-color .2s,box-shadow .2s}
.search-line:focus-within{border-color:var(--cyan);box-shadow:0 0 0 3px #2ec9d820}.search-line .icon{width:19px;height:19px}.search-line input{width:100%;height:100%;border:0;background:transparent;color:#edf5f8;outline:0;font-size:12px;font-weight:600;min-width:0}.search-line input::placeholder{color:#8ba5b1;opacity:1}
.filter-bottom{display:flex;align-items:stretch;gap:10px;margin-top:11px}.search-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;flex:1;min-width:0}.search-row select,.sortbar select{appearance:none;-webkit-appearance:none;border:1px solid #395563;background-color:#0d202a;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239eb9c5' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;border-radius:11px;padding:0 33px 0 13px;height:43px;color:#d4e5ed;font-size:11px;font-weight:650;min-width:0;width:100%;cursor:pointer}
.search-row option,.sortbar option{background:#102530;color:#eaf5f8}.search-actions{display:flex;gap:9px;min-width:205px}.search-actions>*{display:flex;align-items:center;justify-content:center;gap:7px;height:43px;padding:0 18px;text-decoration:none;border-radius:11px;white-space:nowrap;font-size:11px;font-weight:800;cursor:pointer}.search-actions .icon{width:16px;height:16px}.primary{background:linear-gradient(150deg,#45d2df,#16aac2);border:1px solid #6ae5ed;color:#052834;box-shadow:0 4px 13px #01a9c423;transition:filter .2s}.primary:hover{filter:brightness(1.07)}.reset-btn{background:#162c37;color:#d7e9f0;border:1px solid #395563}.reset-btn:hover{background:#1a3845}

.quick-filters{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:9px;margin:17px 0 26px}
.quick-filters a{height:42px;min-width:0;display:flex;align-items:center;justify-content:center;gap:5px;text-decoration:none;color:#c1d5df;background:#132530;border:1px solid #2d4856;border-radius:10px;font-size:10px;font-weight:720;white-space:nowrap;transition:border-color .2s,background .2s,transform .2s}
.quick-filters a:hover{background:#1a3340;border-color:#5b98a5;transform:translateY(-1px)}.quick-filters a.active{background:linear-gradient(150deg,#1c5867,#173f4c);border-color:#39ccdf;color:#d7f8ff;box-shadow:inset 0 0 0 1px rgba(64,202,219,.15)}.quick-filters a.hot{color:#ffd18b}.quick-filters a.active-hot{background:#3b2d24;border-color:#d9994d;color:#ffcb79}.quick-filters a small{font-size:9px;border:1px solid #357583;background:#173b46;padding:0 6px;border-radius:12px}.quick-filters .icon{width:14px;height:14px;color:#ffb858}

/* Catalogue headings */
.catalog-toolbar{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:15px}.catalog-heading{min-width:0}.section-kicker{display:flex;align-items:center;gap:7px;color:#96b2bf;font-size:9px;letter-spacing:2.1px;font-weight:800}.section-kicker i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold)}
.section-title{display:flex;align-items:center;gap:11px;margin-top:5px}.section-title h1{font-size:22px;line-height:1.25;letter-spacing:-.9px;font-weight:850;margin:0}.section-title span{font-size:11px;font-weight:800;background:#22c3d7;color:#08232d;border-radius:99px;padding:3px 11px}
.sortbar{display:flex;align-items:center;gap:10px;min-width:215px}.sortbar label{white-space:nowrap;font-size:11px;color:var(--muted)}.sortbar select{height:39px;background-color:#132732;border-color:#32505d;width:145px;font-size:11px;font-weight:700}

/* Product cards: 3 columns on PC */
.account-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px;align-items:stretch}
.account-card{overflow:hidden;min-width:0;display:flex;flex-direction:column;border:1px solid #33505c;border-radius:16px;background:linear-gradient(180deg,#152b37,#10232e);box-shadow:0 8px 26px #0003;transition:transform .22s ease,border-color .22s,box-shadow .22s}
.account-card:hover{transform:translateY(-4px);border-color:#4db9c8;box-shadow:0 17px 36px #0005}.card-image-wrap{display:block;position:relative;aspect-ratio:16/9;background:#0c1c26;overflow:hidden}.card-image-wrap img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .32s ease}.account-card:hover .card-image-wrap img{transform:scale(1.035)}.account-card.is-sold .card-image-wrap img{filter:grayscale(.45) brightness(.79)}.no-image{height:100%;display:grid;place-items:center;color:var(--muted)}.no-image .icon{height:42px;width:42px}
.hot-badge,.status-badge{position:absolute;top:10px;display:inline-flex;align-items:center;gap:5px;font-size:10px;line-height:1;font-weight:800;padding:8px 9px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.hot-badge{left:10px;border-radius:8px;background:#f37035;color:white;box-shadow:0 4px 15px #0006}.hot-badge .icon{width:13px;height:13px}
.status-badge{right:10px;color:#b6ffe0;background:#092d2be8;border:1px solid #2a9078;border-radius:8px}.status-badge i,.ready-pill i{width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 3px #50d9aa24}.status-badge.sold{background:#3b252be8;border-color:#ab656e;color:#ffd0d3}.status-badge.sold i,.ready-pill.sold i{background:#fb848a;box-shadow:0 0 0 3px #fb848a22}
.card-body{display:flex;flex:1;flex-direction:column;min-height:122px;padding:14px}.card-heading{display:flex;gap:8px;align-items:center;justify-content:space-between}.card-heading>a{text-decoration:none;min-width:0}.card-heading h2{margin:0;font-size:14px;line-height:1.3;letter-spacing:-.35px;font-weight:850}.card-heading a:hover h2{color:var(--cyan)}.type-badge{font-size:9px;font-weight:800;letter-spacing:.6px;padding:3px 7px;border:1px solid #325360;border-radius:6px;color:#9ec0cb;white-space:nowrap}.updated{color:#8aa6b3;font-size:10px;margin-top:4px}.card-footer{margin-top:auto;border-top:1px solid #2a4450;padding-top:12px;display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-top:12px}.price-wrap{display:flex;flex-direction:column;gap:2px;min-width:0}.price-label{font-size:10px;color:var(--muted)}.price{font-size:24px;font-weight:850;line-height:1.1;letter-spacing:-.9px;color:var(--coral);white-space:nowrap}.view-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:35px;padding:0 12px;text-decoration:none;font-size:10px;font-weight:800;white-space:nowrap;background:#173e46;border:1px solid #2d8592;border-radius:9px;color:#9deaf0;transition:background .2s,color .2s}.view-btn .icon{width:14px;height:14px}.view-btn:hover{background:#24b9cd;color:#07252e}
.pager{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:7px;margin:28px 0 30px}.pager>a{height:37px;min-width:37px;padding:0 8px;display:grid;place-items:center;text-decoration:none;color:#b5d0db;font-size:12px;font-weight:800;border:1px solid #355361;border-radius:10px;background:#112631}.pager a:hover{border-color:var(--cyan)}.pager a.active{background:linear-gradient(135deg,#3bd0dd,#1b9fbb);color:#08222a;border-color:#54d9e5}.pager .icon{width:16px;height:16px}.pager-dots{padding:0 3px;color:var(--muted)}.empty-state{border:1px dashed #365563;border-radius:var(--r-xl);background:#10232e;min-height:220px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;gap:7px;padding:28px;color:var(--muted)}.empty-state>.icon{height:34px;width:34px;color:var(--cyan);margin-bottom:9px}.empty-state b{font-size:18px;color:var(--text)}.empty-state .view-btn{margin-top:11px}

/* Last section and true footer */
.footer-benefits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);border-radius:var(--r-xl);background:linear-gradient(145deg,#142c37,#101e2a);overflow:hidden;margin-top:30px;box-shadow:var(--shadow)}.footer-benefit{display:flex;align-items:center;gap:10px;min-width:0;padding:22px 15px;border-right:1px solid var(--line-soft)}.footer-benefit:last-child{border-right:0}.footer-benefit-icon{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#163847;color:var(--cyan);flex:0 0 auto}.footer-benefit-icon .icon{width:23px;height:23px}.footer-benefit-icon.gold-icon{background:#3c3222;color:var(--gold)}.footer-benefit p b{display:block;font-size:10px;font-weight:800;line-height:1.4;letter-spacing:.2px}.footer-benefit small{display:block;margin-top:4px;font-size:10px;line-height:1.45;color:var(--muted)}
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:27px 3px 10px;margin-top:8px;border-top:1px solid #233f4a;color:#90a9b3}.site-footer strong{font-size:12px;color:#b8d9e4;font-weight:850}.site-footer p{font-size:10px;margin:3px 0 0}.footer-contact{display:inline-flex;align-items:center;gap:8px;text-decoration:none;padding:8px 12px;border:1px solid #2b6470;border-radius:10px;background:#122f39;color:#7fdee8;white-space:nowrap;font-size:11px;font-weight:800}.footer-contact .icon{height:15px;width:15px}

/* Floating contact dock, deliberately compact */
.bottom-nav{position:fixed;z-index:30;left:50%;bottom:max(12px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(500px,calc(100% - 30px));height:63px;background:#0e222eec;border:1px solid #36535f;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 14px 40px #0009;border-radius:18px;display:flex;justify-content:center;align-items:stretch;padding:5px}
.bottom-nav a{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;border-radius:12px;color:#c7dbe4;text-decoration:none;transition:color .2s,background .2s}.bottom-nav a:hover,.bottom-nav a.nav-home{background:#163743;color:var(--cyan)}.bottom-nav a>.icon{height:21px;width:21px}.bottom-nav a:nth-child(2)>.icon{color:#4b92ff}.bottom-nav b{font-size:9px;font-weight:760;line-height:1.2;white-space:nowrap}.zalo-mark{border-radius:50%;background:#fff;color:#1675df;display:grid;place-items:center;width:23px;height:23px;font-size:8px;font-weight:900;letter-spacing:-.7px;line-height:1}

/* Detail page – gallery and content side-by-side on PC */
.detail-page{padding-top:2px}.back-btn{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;margin-bottom:17px;background:#132833;border:1px solid #36505b;border-radius:10px;color:#b7d7e1;text-decoration:none;font-size:11px;font-weight:800}.back-btn:hover{border-color:var(--cyan)}.back-btn .icon{width:15px;height:15px}.detail-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(340px,.75fr);align-items:start;gap:20px}.detail-gallery{min-width:0}.gallery-card{position:relative;background:#112531;border:1px solid #375764;border-radius:18px;overflow:hidden}.main-image-btn{padding:0;width:100%;border:0;background:#0a1a22;cursor:zoom-in}.main-image-btn img{width:100%;height:auto;max-height:600px;object-fit:contain;display:block}.image-hint{display:flex;align-items:center;justify-content:center;gap:6px;padding:12px;color:#aac4ce;font-size:10px}.image-hint .icon{height:15px;width:15px;color:var(--cyan)}.thumbs{display:flex;gap:9px;margin:13px 0 20px;overflow-x:auto;padding:0 0 5px}.thumb{padding:0;flex:0 0 auto;width:108px;height:66px;overflow:hidden;border-radius:10px;background:#132834;border:2px solid #304f5b;cursor:pointer}.thumb.active{border-color:var(--gold)}.thumb img{display:block;width:100%;height:100%;object-fit:cover}.detail-card{min-width:0;padding:23px;border:1px solid #36525e;border-radius:18px;background:linear-gradient(155deg,#142a36,#10222d)}.ready-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;background:#103b34;color:#91f1c9;border:1px solid #358d71;border-radius:7px;font-size:10px;font-weight:850}.ready-pill.sold{background:#3b252b;border-color:#ad6670;color:#ffc4ce}.detail-kicker{margin-top:24px;color:var(--cyan);font-size:9px;font-weight:800;letter-spacing:1.75px}.detail-card h1{font-size:24px;line-height:1.3;letter-spacing:-.75px;margin:7px 0 18px;font-weight:850}.detail-price-box{padding:16px;background:linear-gradient(135deg,#283528,#24303a);border:1px solid #746b43;border-radius:13px}.detail-price-box small,.detail-price-box span{display:block;font-size:11px;color:#a6bab5}.detail-price-box strong{display:block;font-size:35px;line-height:1.3;letter-spacing:-1px;color:var(--gold);margin:3px 0 5px}.detail-list{margin:16px 0}.detail-list>div{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid #2d4551;font-size:11px}.detail-list dt{color:var(--muted)}.detail-list dd{margin:0;text-align:right;color:#dcebf1;font-weight:780}.contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.contact-grid a{display:flex;justify-content:center;align-items:center;gap:7px;min-height:42px;padding:7px;border-radius:10px;border:1px solid transparent;text-decoration:none;font-size:11px;font-weight:780;white-space:nowrap}.contact-grid .icon{width:15px;height:15px}.zalo-contact{background:#25b9d0;color:#072a32}.call-contact{background:#f8bf4f;color:#332600}.fb-contact{background:#306fcc;color:#fff}.box-contact{background:#1e5261;color:#bce5f0;border-color:#427588!important}.contact-grid .zalo-mark{width:20px;height:20px;font-size:7px}.note{font-size:10px;color:var(--muted);background:#0f2731;border:1px solid #2c4a56;border-radius:10px;margin-top:12px;padding:11px}

/* Preview/lightbox and contact popup */
.image-modal{position:fixed;z-index:200;inset:0;background:#02090dee;backdrop-filter:blur(10px);display:grid;place-items:center;padding:16px}.image-modal[hidden],.popup-backdrop[hidden]{display:none}.image-modal img{display:block;max-width:98vw;max-height:94dvh;object-fit:contain}.modal-x,.popup-x{display:grid;place-items:center;width:37px;height:37px;border:1px solid #496878;border-radius:50%;background:#142935;color:#dfeff4;cursor:pointer}.modal-x{position:absolute;right:17px;top:17px}.modal-x .icon,.popup-x .icon{height:18px;width:18px}
.popup-backdrop{position:fixed;z-index:100;inset:0;background:#051018e8;backdrop-filter:blur(7px);display:grid;place-items:center;padding:17px}.contact-popup{width:min(440px,100%);padding:33px 25px 23px;position:relative;text-align:center;border-radius:21px;border:1px solid #397286;background:radial-gradient(circle at 50% 0%,#193f48,#10252f 60%);box-shadow:0 28px 100px #000c}.popup-x{position:absolute;top:12px;right:12px}.popup-mini{color:var(--cyan);font-size:10px;font-weight:800;letter-spacing:2.5px;text-transform:uppercase;margin:2px 28px 12px}.contact-popup h2{margin:0;font-size:25px;letter-spacing:-.75px}.popup-pill{margin:15px auto 5px;color:#2e2a19;background:var(--gold);border-radius:30px;padding:7px 17px;display:table;font-size:11px;font-weight:800}.contact-popup p{color:var(--muted);font-size:11px;margin:12px 0 18px}.popup-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.popup-actions a{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;background:#1687c2;color:white;border:1px solid #4d9acc;border-radius:11px;font-size:10px;text-decoration:none;font-weight:800}.popup-actions a:first-child{background:var(--cyan-strong);color:#092a34;border-color:#66d9e8}.popup-actions .icon{width:18px;height:18px}.popup-actions .zalo-mark{height:21px;width:21px;font-size:7px}.mute-popup{margin-top:13px;width:100%;height:39px;background:#15303d;border:1px solid #3b6271;color:#afcbd5;border-radius:11px;font-size:11px;font-weight:750;display:flex;gap:8px;align-items:center;justify-content:center;cursor:pointer}.mute-popup .icon{width:15px;height:15px}

@media (max-width:1050px){.quick-filters{grid-template-columns:repeat(4,minmax(0,1fr))}.trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.trust-item:nth-child(2){border-right:0}.trust-item:nth-child(-n+2){border-bottom:1px solid var(--line-soft)}.footer-benefits{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-benefit:nth-child(2){border-right:0}.footer-benefit:nth-child(-n+2){border-bottom:1px solid var(--line-soft)}}
@media (max-width:830px){.container{width:calc(100% - 30px)}.account-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.detail-layout{grid-template-columns:1fr}.detail-card{max-width:none}.filter-bottom{display:block}.search-row{margin-bottom:10px}.search-actions{justify-content:flex-end}.search-actions>*{flex:1}}
@media (max-width:600px){
 body{font-size:12px}.container{width:calc(100% - 26px)}.page-shell{padding-bottom:89px}.site-header{margin-bottom:15px}.topbar{min-height:66px;gap:8px;padding:9px 0}.brand{gap:8px}.brand img{width:43px;height:43px;box-shadow:0 0 0 3px #122a36}.brand-text{gap:5px}.brand-text strong{font-size:13px;letter-spacing:-.35px}.brand-text>span{font-size:8px;padding:3px 5px;letter-spacing:.65px}.top-actions{gap:5px}.square-btn{width:35px;height:35px;border-radius:10px}.square-btn .icon{height:16px;width:16px}.zalo-wordmark{font-size:9px}
 .hero-card{border-radius:14px}.trust-grid{margin:13px 0 18px;border-radius:14px;padding:0}.trust-item{min-height:74px;gap:9px;padding:12px 11px}.trust-icon{width:31px;height:31px;border-radius:9px}.trust-icon .icon{height:17px;width:17px}.trust-item b{font-size:9px;letter-spacing:0}.trust-item small{font-size:9px;margin-top:2px;line-height:1.3}
 .search-panel{padding:13px;border-radius:14px}.panel-heading{margin-bottom:11px}.panel-heading h2{font-size:14px}.eyebrow{font-size:8px;letter-spacing:1.4px}.panel-tag{font-size:9px}.search-line{height:42px;padding:0 11px;border-radius:9px}.search-line input{font-size:11px}.search-line .icon{height:17px;width:17px}.filter-bottom{margin-top:9px}.search-row{gap:8px;margin-bottom:8px}.search-row select{height:39px;padding-left:10px;font-size:10px;border-radius:9px;background-position:right 9px center}.search-actions{gap:8px}.search-actions>*{height:40px;border-radius:9px;font-size:10px}.search-actions .primary{flex:1.5}.search-actions .reset-btn{flex:1}
 .quick-filters{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:14px 0 23px}.quick-filters a{height:37px;font-size:9px;border-radius:9px;letter-spacing:-.1px}.quick-filters a small{font-size:8px;padding:0 4px}.quick-filters .icon{width:12px;height:12px}
 .catalog-toolbar{gap:7px;align-items:flex-end;margin-bottom:12px}.section-kicker{font-size:8px;letter-spacing:1.4px}.section-kicker i{width:6px;height:6px}.section-title{gap:7px}.section-title h1{font-size:17px;letter-spacing:-.65px}.section-title span{font-size:10px;padding:2px 8px}.sortbar{gap:6px;min-width:0}.sortbar label{font-size:9px}.sortbar select{width:103px;height:33px;font-size:9px;padding:0 18px 0 9px;background-position:right 6px center}
 .account-grid{grid-template-columns:1fr;gap:14px}.account-card{border-radius:14px}.card-body{min-height:0;padding:12px 13px 13px}.card-heading h2{font-size:13px}.type-badge{font-size:8px}.updated{font-size:9px}.card-footer{padding-top:10px;margin-top:9px}.price-label{font-size:9px}.price{font-size:23px}.view-btn{height:34px;min-height:34px;padding:0 14px;font-size:10px}.hot-badge,.status-badge{top:9px;padding:7px 9px;font-size:9px}.hot-badge{left:9px}.status-badge{right:9px}
 .footer-benefits{border-radius:14px;margin-top:25px}.footer-benefit{padding:16px 11px;gap:8px}.footer-benefit-icon{width:30px;height:30px;border-radius:9px}.footer-benefit-icon .icon{width:18px;height:18px}.footer-benefit p b{font-size:9px}.footer-benefit small{font-size:9px;margin-top:2px}.site-footer{padding:19px 1px 8px;gap:10px}.site-footer strong{font-size:10px}.site-footer p{font-size:9px}.footer-contact{font-size:9px;padding:7px 9px}
 .bottom-nav{width:calc(100% - 22px);height:61px;border-radius:17px;bottom:max(10px,env(safe-area-inset-bottom))}.bottom-nav b{font-size:9px}.bottom-nav a>.icon{width:19px;height:19px}.zalo-mark{width:21px;height:21px;font-size:7px}
 .back-btn{margin-bottom:12px}.detail-page{padding-top:0}.gallery-card{border-radius:14px}.detail-card{padding:16px;border-radius:14px}.detail-kicker{margin-top:17px}.detail-card h1{font-size:21px;margin:7px 0 13px}.detail-price-box strong{font-size:32px}.detail-list>div{padding:9px 0}.thumb{width:87px;height:55px}.contact-popup{padding:35px 16px 20px}.contact-popup h2{font-size:22px}
}
@media(max-width:365px){.brand-text strong{font-size:11px}.brand-text>span{font-size:7px;padding:2px 4px}.brand img{width:39px;height:39px}.top-actions{gap:4px}.square-btn{width:32px;height:32px}.container{width:calc(100% - 22px)}.catalog-toolbar{align-items:flex-start;flex-wrap:wrap}.sortbar{margin-left:auto}.quick-filters a{font-size:8px}.trust-item{padding:11px 7px;gap:6px}.trust-item b{font-size:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* V8: compact listing. Keep 3 cards per PC row, 2 per mobile row. */
@media (min-width:831px) {
  .account-grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .account-card {border-radius:12px}
  .card-body {min-height:104px;padding:10px 11px}
  .card-heading h2 {font-size:12px}
  .updated {font-size:9px}
  .card-footer {margin-top:8px;padding-top:8px}
  .price {font-size:20px}
  .view-btn {height:32px;min-height:32px;padding-inline:10px;font-size:10px}
}
@media (max-width:600px) {
  .account-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .account-card {border-radius:10px}
  .card-body {padding:8px;min-height:0}
  .card-heading {gap:4px;align-items:center}
  .card-heading h2 {font-size:11px;letter-spacing:-.3px}
  .type-badge {font-size:7px;padding:2px 4px}
  .updated {font-size:8px;margin-top:3px}
  .card-footer {display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;padding-top:6px}
  .price-wrap {min-width:0}
  .price-label {font-size:8px}
  .price {font-size:17px;white-space:nowrap}
  .view-btn {height:27px;min-height:27px;padding:0 8px;font-size:9px;flex-shrink:0}
  .view-btn .icon {width:11px;height:11px}
  .hot-badge,.status-badge {top:5px;padding:4px 5px;font-size:7px;border-radius:5px;gap:3px}
  .hot-badge {left:5px}.status-badge {right:5px}
  .hot-badge .icon {width:9px;height:9px}
  .status-badge i {width:4px;height:4px}
  .footer-benefits {margin-top:19px}
}
@media (max-width:365px) {
  .account-grid {gap:6px}
  .card-body {padding:6px}
  .card-heading h2 {font-size:10px}
  .type-badge {font-size:6px}
  .price {font-size:15px}
  .view-btn {font-size:8px;min-height:25px;height:25px;padding:0 5px}
}

/* V9 — giao diện do admin điều khiển qua /giaodien */
:root[data-theme="black"]{color-scheme:dark;--bg:#050505;--bg-deep:#000;--surface:#101010;--surface-2:#161616;--raised:#202020;--line:#373737;--line-soft:#292929;--text:#f3f3f3;--muted:#aaa;--cyan:#e3e5ea;--cyan-strong:#c3c8d0;--gold:#ffc65a}
[data-theme="black"] body{background:#050505}
[data-theme="black"] :is(.site-header,.hero-card,.trust-grid,.search-panel,.account-card,.detail-card,.gallery-card,.bottom-nav,.contact-popup,.footer-benefits,.footer-benefit,.quick-filters a,.sortbar select,.search-row select,.search-line,.card-image-wrap,.view-btn,.pager>a,.note,.back-btn,.detail-price-box){background:#111;color:var(--text);border-color:#343434}
[data-theme="black"] :is(.account-card,.detail-card,.hero-card,.search-panel){box-shadow:0 8px 23px #0008}
[data-theme="black"] :is(.bottom-nav a.nav-home,.bottom-nav a:hover,.bottom-nav button:hover){background:#303030}
:root[data-theme="light"]{color-scheme:light;--bg:#f4f7fa;--bg-deep:#fff;--surface:#fff;--surface-2:#f1f6f8;--raised:#edf4f7;--line:#d5e0e7;--line-soft:#e2e9ee;--text:#142c38;--muted:#607786;--cyan:#08788e;--cyan-strong:#03748e;--gold:#a66d06;--coral:#c43a30;--mint:#16845d;--shadow:0 8px 30px #14384812}
[data-theme="light"] body{background:linear-gradient(170deg,#eaf4f8,#f7f9fc 30%,#fff);color:var(--text)}
[data-theme="light"] :is(.site-header,.hero-card,.trust-grid,.search-panel,.account-card,.detail-card,.gallery-card,.bottom-nav,.contact-popup,.footer-benefits,.footer-benefit,.quick-filters a,.sortbar select,.search-row select,.search-line,.card-image-wrap,.view-btn,.pager>a,.note,.back-btn,.detail-price-box,.thumb,.reset-btn,.empty-state,.mute-popup){background:#fff;color:var(--text);border-color:#d8e4eb;box-shadow:0 3px 14px #0d33400b}
[data-theme="light"] :is(.trust-item,.card-footer,.detail-list>div){border-color:#e0e9ed}
[data-theme="light"] :is(.trust-item small,.footer-benefit small,.detail-list dt,.price-label,.updated,.note,.section-kicker,.sortbar label,.image-hint){color:#607786}
[data-theme="light"] :is(.search-line input,.search-row select,.sortbar select){color:#143242;background-color:#fff}
[data-theme="light"] .search-line input::placeholder{color:#728c99}
[data-theme="light"] :is(.search-row option,.sortbar option){color:#143242;background:#fff}
[data-theme="light"] .brand-text strong{color:#08788e}
[data-theme="light"] :is(.bottom-nav a,.bottom-nav button){color:#345566}
[data-theme="light"] :is(.bottom-nav a.nav-home,.bottom-nav a:hover,.bottom-nav button:hover){background:#e5f4f7;color:#08788e}
[data-theme="light"] .account-card:hover{border-color:#1499b1}
[data-theme="light"] .view-btn{background:#e7f6f8;color:#086d82;border-color:#b8d9e2}
[data-theme="light"] .type-badge{color:#345566;border-color:#d0dfe5}
[data-theme="light"] .quick-filters a.active{background:#daf3f7;color:#075c70;border-color:#0a869e}
[data-theme="light"] .ready-pill{background:#dcf8e9;color:#116543;border-color:#8dd1b3}
[data-theme="light"] .detail-list dd{color:#142c38}
[data-theme="light"] .detail-price-box strong{color:#965806}
[data-theme="light"] .bottom-nav .zalo-mark{background:#1479ee;color:#fff}
/* Liên hệ và Bot ghép ảnh */
.bottom-nav button{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;border:0;border-radius:12px;color:#c7dbe4;background:transparent;cursor:pointer;padding:0;font:inherit}
.bottom-nav button>.icon{height:21px;width:21px}
.bottom-nav button b{font-size:9px;font-weight:760;line-height:1.2;white-space:nowrap}
.bottom-nav button:hover{background:#163743;color:var(--cyan)}
.nav-contact-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:20px}
.nav-contact-actions a{display:flex;align-items:center;justify-content:center;gap:7px;padding:12px 5px;border-radius:10px;text-decoration:none;font-size:12px;font-weight:750;background:#17586c;color:#fff}
.nav-contact-actions a>.icon{width:17px;height:17px}
[data-theme="light"] .nav-contact-actions a{background:#d7f0f6;color:#16475a}
@media(max-width:600px){.bottom-nav button>.icon{width:19px;height:19px}}