/* HẠO NAM AI V2.1.10 — shared ModuleShell + distinct module environments. */
.module-screen{--module-accent:#64d2ff;--module-accent-rgb:100,210,255;padding-top:calc(var(--safe-top) + 18px);background-color:#05070c}
/* Used: graphite + cyan, low horizontal inventory light. */
#maycu{--module-accent:#64d2ff;--module-accent-rgb:100,210,255;background:radial-gradient(74% 36% at 18% 11%,rgba(61,174,238,.15),transparent 68%),linear-gradient(90deg,rgba(18,35,49,.22),transparent 56%),linear-gradient(180deg,#09111a 0%,#05090f 48%,#03060b 100%)}
/* Repair: deep petrol + teal/green, work light falls toward the center. */
#suachua{--module-accent:#65e3a6;--module-accent-rgb:101,227,166;background:radial-gradient(54% 46% at 50% 4%,rgba(45,182,126,.16),transparent 70%),radial-gradient(36% 26% at 66% 31%,rgba(0,160,145,.07),transparent 74%),linear-gradient(180deg,#081514 0%,#050d0e 48%,#030708 100%)}
/* New: midnight showroom + violet/indigo light from upper-right. */
#quote{--module-accent:#c997ff;--module-accent-rgb:201,151,255;background:radial-gradient(62% 42% at 92% -2%,rgba(162,82,225,.18),transparent 69%),radial-gradient(36% 28% at 68% 16%,rgba(77,96,220,.08),transparent 72%),linear-gradient(180deg,#090b16 0%,#050610 48%,#03040a 100%)}
#data{--module-accent:#c997ff;--module-accent-rgb:201,151,255;background:linear-gradient(180deg,#090b16,#04050b)}
#search{--module-accent:#8fd4ff;--module-accent-rgb:143,212,255;background:linear-gradient(180deg,#08111b,#04070c)}

.module-head{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;grid-template-rows:1fr;align-items:start;column-gap:14px;width:min(100%,var(--content-max));min-height:104px;margin-bottom:18px}
#home .module-head::before{content:"";display:block;width:42px;height:42px;grid-column:1;grid-row:1}
.module-head-copy,.brand-lockup{grid-column:2;grid-row:1;min-width:0}.module-head-copy{position:relative;flex:1}
.module-kicker{display:inline-flex;align-items:center;gap:7px;min-height:23px;margin:0 0 7px;padding:4px 9px;border:1px solid rgba(var(--module-accent-rgb),.2);border-radius:999px;background:rgba(var(--module-accent-rgb),.07);color:var(--module-accent);font-size:10px;font-weight:790;line-height:1;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.module-kicker::before{content:"";width:6px;height:6px;flex:none;border-radius:50%;background:currentColor;box-shadow:0 0 11px currentColor}
.module-title,.brand-lockup .title{margin:0;color:#f5f5f7;font-size:clamp(30px,7vw,46px);line-height:1.05;letter-spacing:-.8px;font-weight:790}.module-title{text-shadow:0 0 28px rgba(var(--module-accent-rgb),.055)}
.module-head-copy::after{content:"";display:block;width:42px;height:3px;margin-top:11px;border-radius:999px;background:linear-gradient(90deg,var(--module-accent),rgba(var(--module-accent-rgb),0));box-shadow:0 0 18px rgba(var(--module-accent-rgb),.16)}
.brand-lockup{padding-top:21px}.module-subtitle,.brand-subline{height:21px;margin:7px 0 0;color:var(--text-2);font-size:14px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand-subline{font-size:11.5px;font-weight:620;letter-spacing:.015em}.brand-subline strong{color:#b8c5d3;font-weight:760}

.module-home,.module-back{width:42px;height:42px;grid-row:1;margin-top:20px;display:grid;place-items:center;flex:none;border-radius:50%;border:1px solid rgba(var(--module-accent-rgb),.22);color:var(--module-accent);background:rgba(35,35,39,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 10px 28px rgba(0,0,0,.18),0 0 22px rgba(var(--module-accent-rgb),.045);-webkit-backdrop-filter:blur(22px) saturate(150%);backdrop-filter:blur(22px) saturate(150%);transition:transform .16s ease,border-color .16s ease,background .16s ease}
.module-back{grid-column:1}.module-home{grid-column:3}.module-home svg,.module-back svg{width:20px;height:20px}.module-home:active,.module-back:active{transform:scale(.95)}
.module-body{display:grid;gap:14px;width:min(100%,var(--content-max))}.module-card{padding:18px;border-radius:22px;background:linear-gradient(145deg,rgba(53,53,58,.46),rgba(24,24,28,.48));border:1px solid rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 12px 34px rgba(0,0,0,.16);-webkit-backdrop-filter:blur(24px) saturate(150%);backdrop-filter:blur(24px) saturate(150%)}.module-card h2{margin:0 0 7px;font-size:18px}.module-card p{margin:0;color:var(--text-2);font-size:13.5px;line-height:1.5}.module-card .module-state{display:inline-flex;align-items:center;gap:7px;margin-top:13px;padding:7px 10px;border-radius:999px;background:rgba(var(--module-accent-rgb),.08);border:1px solid rgba(var(--module-accent-rgb),.14);color:var(--module-accent);font-size:11px;font-weight:720}.module-state-dot{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 12px currentColor}

/* New-device controls: graphite material, violet selection; series remain smaller secondary pills. */
#quote>.quote-root{width:max-content;max-width:100%;margin:2px 0 14px;padding:5px;border:1px solid rgba(255,255,255,.075);border-radius:999px;background:rgba(34,34,38,.78);box-shadow:inset 0 1px 0 rgba(255,255,255,.07);-webkit-backdrop-filter:blur(20px) saturate(145%);backdrop-filter:blur(20px) saturate(145%)}
#quote>.quote-root .quote-root-btn{border:0;background:transparent;box-shadow:none;padding:10px 16px}
#quote>.quote-root .quote-root-btn.on{color:#fff;background:linear-gradient(145deg,#a650de,#6c47ca);border-color:transparent;box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 6px 20px rgba(167,80,222,.18)}
#quote .search:focus-within{border-color:rgba(201,151,255,.32);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 0 3px rgba(191,90,242,.065)}
#quote .series-btn.on,#quote .other-btn.on{color:#debaff;background:linear-gradient(145deg,rgba(91,53,140,.72),rgba(45,31,83,.68));border-color:rgba(181,124,236,.56);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 7px 20px rgba(103,50,164,.12)}

@media(max-width:420px){.module-subtitle{font-size:13px}.module-head{column-gap:10px}.module-kicker{font-size:9.5px;padding:4px 8px}.module-head-copy::after{margin-top:9px}}
@media(min-width:1200px){.module-screen{padding-top:32px}.module-head{grid-template-columns:46px minmax(0,1fr) 46px;min-height:116px;margin-bottom:18px}.module-title,.brand-lockup .title{font-size:46px}#home .module-head::before{width:46px;height:46px}.module-home,.module-back{width:46px;height:46px;margin-top:20px}}