/* Tema gelap/terang untuk beranda dan halaman tanpa menu (masuk, daftar, unduh, coba).
   Otomatis mengikuti perangkat; pilihan manual (tombol 🌓) disimpan di browser. Bagian dalam aplikasi belum bertema gelap. */
.theme-btn{border:1px solid var(--line,#dde3ef);background:var(--card,#fff);color:var(--ink,#14213d);border-radius:10px;width:40px;height:40px;font-size:1.15rem;cursor:pointer;line-height:1}
.bare-theme{position:fixed;top:10px;left:10px;z-index:40}
/* Palet gelap dasar untuk seluruh aplikasi (variabel dipakai app.css dan turunannya). */
:root[data-theme="dark"]{color-scheme:dark;--bg:#0c1524;--card:#14233a;--ink:#e8eefb;--muted:#a3b3cf;--line:#2a3d5c;--brand:#1d4170;--accent:#5b9bff;--ok:#4cc38a;--bad:#ff8a80;--warn:#f3c969;--warnbg:#3a2f12}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark;--bg:#0c1524;--card:#14233a;--ink:#e8eefb;--muted:#a3b3cf;--line:#2a3d5c;--brand:#1d4170;--accent:#5b9bff;--ok:#4cc38a;--bad:#ff8a80;--warn:#f3c969;--warnbg:#3a2f12}}
/* Beranda dan halaman tanpa menu: variabel tambahan */
:root[data-theme="dark"] body.landing,:root[data-theme="dark"] body.bare{--brand:#9ec2ff;--blue:#7fb0ff;--grid:#223452;--paper:#101d33;--red:#ff7a70;--hl:#ffe066;--mute:#a3b3cf;--surf:#14233a;--page:#0c1524;--page-a:rgba(12,21,36,.94);--hover:#1b2e4d;--alt:#101d33;--final:#0a1830;--okink:#58d68d;background:var(--bg)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) body.landing,:root:not([data-theme="light"]) body.bare{--brand:#9ec2ff;--blue:#7fb0ff;--grid:#223452;--paper:#101d33;--red:#ff7a70;--hl:#ffe066;--mute:#a3b3cf;--surf:#14233a;--page:#0c1524;--page-a:rgba(12,21,36,.94);--hover:#1b2e4d;--alt:#101d33;--final:#0a1830;--okink:#58d68d;background:var(--bg)}}
/* Teks yang memakai --brand (warna latar di mode terang) dibuat terang di mode gelap */
:root[data-theme="dark"] :is(.stat-n,.plan-price,.brand-lg){color:#9ec2ff}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) :is(.stat-n,.plan-price,.brand-lg){color:#9ec2ff}}
:root[data-theme="dark"] .brand-lg .brand-mark{background:#1d4170;color:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .brand-lg .brand-mark{background:#1d4170;color:#fff}}
:root[data-theme="dark"] :is(.cd-done .cd-num,.cd-done .cd-state){color:#062014}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) :is(.cd-done .cd-num,.cd-done .cd-state){color:#062014}}
:root[data-theme="dark"] body{background:var(--bg);color:var(--ink)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) body{background:var(--bg);color:var(--ink)}}
.topbar .theme-btn{width:34px;height:34px;background:transparent;border-color:#ffffff55;color:#fff}
/* elemen dari app.css yang memakai warna tetap */
:root[data-theme="dark"] :is(.landing,.bare) :is(input,select,textarea){background:#0f1c30;border-color:#34496b;color:var(--ink)}
:root[data-theme="dark"] :is(.landing,.bare) .btn{background:#14233a;border-color:#34496b;color:var(--ink)}
:root[data-theme="dark"] :is(.landing,.bare) .btn:hover{background:#1b2e4d}
:root[data-theme="dark"] :is(.landing,.bare) .btn-primary{background:var(--accent);border-color:var(--accent);color:#06142b}
:root[data-theme="dark"] :is(.landing,.bare) .btn-primary:hover{background:#7db0ff}
:root[data-theme="dark"] :is(.landing,.bare) .key{background:#14233a;border-color:#34496b;color:var(--ink)}
:root[data-theme="dark"] :is(.landing,.bare) .key-fn{background:#1b2e4d}
:root[data-theme="dark"] :is(.landing,.bare) .key-ok{background:var(--ok);border-color:var(--ok);color:#06142b}
:root[data-theme="dark"] :is(.landing,.bare) .alert-success{background:#0f2e22;border-color:#2a6b4f;color:#b6efd2}
:root[data-theme="dark"] :is(.landing,.bare) .alert-error{background:#3a1512;border-color:#7a2d27;color:#ffc9c3}
:root[data-theme="dark"] :is(.landing,.bare) .alert-info{background:#10283f;border-color:#2b5379;color:#bcd9f5}
:root[data-theme="dark"] :is(.landing,.bare) .alert-warn{background:var(--warnbg);border-color:#7a6320;color:var(--warn)}
:root[data-theme="dark"] :is(.landing,.bare) code{background:#1b2e4d;color:#e8eefb}
:root[data-theme="dark"] :is(.landing,.bare) .table-wrap{background:var(--card)}
:root[data-theme="dark"] :is(.landing,.bare) .table th{background:#1b2e4d}
:root[data-theme="dark"] :is(.landing,.bare) .btn-google{background:#14233a;border-color:#34496b}
:root[data-theme="dark"] :is(.landing,.bare) a{color:var(--blue)}
:root[data-theme="dark"] :is(.landing,.bare) a.btn-primary{color:#06142b}
@media (prefers-color-scheme:dark){
:root:not([data-theme="light"]) :is(.landing,.bare) :is(input,select,textarea){background:#0f1c30;border-color:#34496b;color:var(--ink)}
:root:not([data-theme="light"]) :is(.landing,.bare) .btn{background:#14233a;border-color:#34496b;color:var(--ink)}
:root:not([data-theme="light"]) :is(.landing,.bare) .btn:hover{background:#1b2e4d}
:root:not([data-theme="light"]) :is(.landing,.bare) .btn-primary{background:var(--accent);border-color:var(--accent);color:#06142b}
:root:not([data-theme="light"]) :is(.landing,.bare) .btn-primary:hover{background:#7db0ff}
:root:not([data-theme="light"]) :is(.landing,.bare) .key{background:#14233a;border-color:#34496b;color:var(--ink)}
:root:not([data-theme="light"]) :is(.landing,.bare) .key-fn{background:#1b2e4d}
:root:not([data-theme="light"]) :is(.landing,.bare) .key-ok{background:var(--ok);border-color:var(--ok);color:#06142b}
:root:not([data-theme="light"]) :is(.landing,.bare) .alert-success{background:#0f2e22;border-color:#2a6b4f;color:#b6efd2}
:root:not([data-theme="light"]) :is(.landing,.bare) .alert-error{background:#3a1512;border-color:#7a2d27;color:#ffc9c3}
:root:not([data-theme="light"]) :is(.landing,.bare) .alert-info{background:#10283f;border-color:#2b5379;color:#bcd9f5}
:root:not([data-theme="light"]) :is(.landing,.bare) .alert-warn{background:var(--warnbg);border-color:#7a6320;color:var(--warn)}
:root:not([data-theme="light"]) :is(.landing,.bare) code{background:#1b2e4d;color:#e8eefb}
:root:not([data-theme="light"]) :is(.landing,.bare) .table-wrap{background:var(--card)}
:root:not([data-theme="light"]) :is(.landing,.bare) .table th{background:#1b2e4d}
:root:not([data-theme="light"]) :is(.landing,.bare) .btn-google{background:#14233a;border-color:#34496b}
:root:not([data-theme="light"]) :is(.landing,.bare) a{color:var(--blue)}
:root:not([data-theme="light"]) :is(.landing,.bare) a.btn-primary{color:#06142b}
}