/* Nền sáng (nút mặt trời/mặt trăng góc phải, nen.js). Nền tối mặc định nằm ở kieu.css / style trong index.html. */
:root[data-nen=sang] { color-scheme:light; --nen:#eef3f8; --the:#ffffff; --o:#f6f9fc; --chu:#0f1a2a; --phu:#5b6b80; --vien:#d5dfea; --nhan:#0089c7; --nhan-chu:#ffffff; --tot:#14a46c; --loi:#e04848; }
[data-nen=sang] body { background:radial-gradient(120% 60% at 50% -10%, #d3efff 0%, rgba(238,243,248,0) 60%) var(--nen); background-attachment:fixed; }
[data-nen=sang] h1 { background-image:linear-gradient(90deg, #0b2540, var(--nhan), #006dff, var(--nhan), #0b2540); }
[data-nen=sang] h1 svg { filter:drop-shadow(0 0 4px rgba(0,137,199,.35)); }
[data-nen=sang] .the { background:var(--the); box-shadow:0 6px 20px rgba(15,40,70,.08); }
[data-nen=sang] label { color:#2b3a4f; }
[data-nen=sang] input::placeholder, [data-nen=sang] textarea::placeholder { color:#9aa7b8; }
[data-nen=sang] button.phu2, [data-nen=sang] .nut.phu2 { background:rgba(0,137,199,.06); border-color:rgba(0,137,199,.4); }
[data-nen=sang] input[type=file] { border-color:rgba(0,137,199,.4); background:rgba(0,137,199,.04); }
[data-nen=sang] nav { background:rgba(255,255,255,.88); }
[data-nen=sang] nav button.chon, [data-nen=sang] .chon2 label:has(input:checked) { background:rgba(0,137,199,.08); }
[data-nen=sang] .nguon label:has(input:checked) { background:rgba(0,137,199,.12); box-shadow:0 0 0 1px var(--nhan), 0 0 12px rgba(0,137,199,.25); }
[data-nen=sang] .hop-th { border-color:rgba(0,137,199,.35); background:rgba(0,137,199,.03); }
[data-nen=sang] .cung { background:rgba(15,26,42,.03); }
[data-nen=sang] #bao { background:#ffffff; border-color:var(--vien); box-shadow:0 12px 30px rgba(15,40,70,.15); }
[data-nen=sang] pre.chep { color:#1d3550; }
[data-nen=sang] .hop, [data-nen=sang] .chon-ds { background:var(--the); }
[data-nen=sang] .hop-nen { background:rgba(15,26,42,.35); }
[data-nen=sang] .chon-ds .muc.tro, [data-nen=sang] .chon-ds .muc:hover { background:rgba(0,137,199,.08); }

.doi-nen { position:absolute; top:18px; right:16px; width:38px; height:38px; padding:0; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--o); border:1px solid var(--vien); color:var(--nhan); }
.doi-nen:not(:disabled):hover { box-shadow:0 0 0 3px rgba(0,227,255,.15); }
.doi-nen svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
main { position:relative; }
main > h1 { padding-right:48px; }