/* Áo "vũ trụ" cho các trang phụ (Cô Ari, Ứng dụng, Flow Video, Bản tin, trang lỗi) để đồng bộ với trang chủ mới QĐ-93 (cô Ari dặn 04/10/2026).
 * Cách làm: KHÔNG viết lại từng trang; chỉ đổi lớp token ngữ nghĩa của assets/ari-tokens.css sang bảng màu nền tối + sao, rồi vá vài chỗ
 * các tệp cũ ghi màu cứng. Nạp SAU ari-tokens.css, ari-chung.css, trang-phu.css và CSS riêng của trang (trang_phu.dau()).
 * Gỡ áo này: bỏ dòng css('vu-tru.css') trong trang_phu.dau() rồi dựng lại, các trang trở về nền hồng sáng như cũ. */
:root {
  color-scheme: dark;
  --vt-nen-1: #2a1836; --vt-nen-2: #150d22; --vt-nen-3: #0a0712; --vt-kem: #ffe2c4; --vt-cam: #ffb46b;
  --c-bg: #0d0916; --c-bg-raise: #1a1228; --c-bg-sunk: #120c1e; --c-bg-invert: #231733;
  --c-text: #fff7f0; --c-text-2: rgb(255 247 240 / .74); --c-text-3: rgb(255 247 240 / .58);
  --c-text-invert: #fff7f0; --c-text-invert-2: rgb(255 247 240 / .7);
  --c-text-accent: #f9a8cc; --c-text-accent-sm: #f9a8cc; --c-text-accent-on-dark: #f9a8cc; --c-text-on-brand: #2a0f1a;
  --c-brand: #f284b5; --c-brand-hover: #f69cc4; --c-brand-soft: rgb(242 132 181 / .22);
  --c-line: rgb(255 226 196 / .16); --c-line-soft: rgb(255 226 196 / .1); --c-line-strong: rgb(255 226 196 / .34);
  --c-focus: #ffb46b; --c-selection: rgb(242 132 181 / .4);
  --glass-thin-bg: linear-gradient(135deg, rgb(255 255 255 / .1), rgb(255 255 255 / .03) 45%, rgb(255 255 255 / .02) 70%, rgb(255 255 255 / .06)), rgb(26 18 40 / .55);
  --glass-thick-bg: linear-gradient(180deg, rgb(255 255 255 / .08), rgb(255 255 255 / 0) 55%), rgb(20 13 32 / .82);
  --glass-edge: rgb(255 226 196 / .22);
  --sh-1: 0 1px 2px rgb(0 0 0 / .3), 0 4px 12px -6px rgb(0 0 0 / .45);
  --sh-2: 0 0 0 .5px rgb(255 226 196 / .14), 0 16px 36px -18px rgb(0 0 0 / .6);
  --sh-3: 0 0 0 .5px rgb(255 226 196 / .18), 0 28px 60px -24px rgb(0 0 0 / .7);
  --sh-glow: 0 0 0 6px rgb(242 132 181 / .16), 0 12px 40px -8px rgb(242 132 181 / .4);
  --sh-glass: inset 1px 1px 0 rgb(255 255 255 / .12), inset -1px -1px 0 rgb(242 132 181 / .1), var(--sh-2);
  --sh-ink: 0 30px 70px -30px rgb(0 0 0 / .8);
}
html { background: var(--vt-nen-3); }
body {
  color: var(--c-text);
  background:
    radial-gradient(ellipse 55% 34% at 72% 8%, rgb(162 58 138 / .2), transparent 70%),
    radial-gradient(ellipse 50% 30% at 18% 38%, rgb(106 58 176 / .16), transparent 70%),
    radial-gradient(ellipse 120% 60% at 50% 0%, var(--vt-nen-1) 0%, var(--vt-nen-2) 46%, var(--vt-nen-3) 100%) var(--vt-nen-3);
  background-attachment: fixed;
}
/* sao: hai lớp chấm lặp lại, không JS, không ảnh. Lớp xa nhỏ và mờ, lớp gần to hơn; nằm cố định sau nội dung */
body::before {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    radial-gradient(1px 1px at 12% 18%, rgb(255 236 214 / .9) 50%, transparent 51%), radial-gradient(1px 1px at 37% 62%, rgb(255 220 190 / .7) 50%, transparent 51%),
    radial-gradient(1px 1px at 58% 27%, rgb(255 244 232 / .8) 50%, transparent 51%), radial-gradient(1px 1px at 81% 74%, rgb(255 214 170 / .7) 50%, transparent 51%),
    radial-gradient(1px 1px at 93% 12%, rgb(255 236 214 / .6) 50%, transparent 51%), radial-gradient(1px 1px at 24% 88%, rgb(255 226 196 / .7) 50%, transparent 51%),
    radial-gradient(1.6px 1.6px at 68% 48%, rgb(255 205 150 / .9) 50%, transparent 51%), radial-gradient(1.6px 1.6px at 6% 54%, rgb(255 236 214 / .8) 50%, transparent 51%),
    radial-gradient(1px 1px at 46% 6%, rgb(255 244 232 / .7) 50%, transparent 51%), radial-gradient(1px 1px at 74% 92%, rgb(255 226 196 / .6) 50%, transparent 51%);
  background-size: 310px 290px, 370px 410px, 430px 330px, 290px 470px, 510px 390px, 350px 530px, 590px 610px, 470px 550px, 410px 250px, 530px 430px;
}
body { isolation: isolate; }
::selection { background: var(--c-selection); }

/* chỗ các tệp cũ ghi màu cứng (nền trắng / hồng sáng / mực đen) */
img { color-scheme: light; }
input, textarea, select { color: var(--c-text); background-color: var(--c-bg-raise); border-color: var(--c-line-strong); }
input::placeholder, textarea::placeholder { color: var(--c-text-3); }
/* nền trắng / kính trắng ghi cứng trong ari-chung.css, trang-phu.css, flow-video.css, ban-tin.css -> kính tối */
.nut-kinh:hover, .nav-lien a:hover, .nav-vo .ari-tk, .uptop:hover, .rail-muc:hover, .giong-hong .giong-nut, .kftim, .kfxep, .kfchip, .bt-muc a,
.btquiz-chon button, .cho-trong, .btsoon { background: rgb(255 255 255 / .08); color: var(--c-text); }
.nav-vo .ari-tk:hover, .giong-hong .giong-nut:hover, .kfchip:hover, .bt-muc a:hover, .btquiz-chon button:hover:not([disabled]) { background: rgb(255 255 255 / .15); }
.giong-hong .giong-nut.dang-bat, .giong-hong .giong-thanh { background: rgb(242 132 181 / .24); }
.kfxep select, .kftim input { background: transparent; color: var(--c-text); }
.kfxep option { background: #1a1228; color: #fff7f0; }
.hs-muc-luc, .ud-the:not(.ud-lon) { background: var(--c-bg-raise); }
@media (prefers-reduced-transparency: reduce) {
  .nav-vo, .tam-menu, .dock { background: rgb(20 13 32 / .98); }
  .bia-dong-bia, .the-kinh, .nut-kinh { background: var(--c-bg-raise); }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .nav-vo, .tam-menu, .dock { background: rgb(20 13 32 / .97); }
  .bia-dong-bia, .the-kinh, .nut-kinh { background: var(--c-bg-raise); }
}