/* ========================================================================== base.css Reset & elemen global. ========================================================================== */ *, *::before, *::after { box-sizing: border-box; } /* Beberapa komponen (mis. .empty-state, .fab-menu__actions) mendefinisikan `display` sendiri (flex/grid) yang otomatis menang atas default UA stylesheet untuk `[hidden]` (display: none), karena keduanya sama-sama author-origin. Tanpa aturan ini, elemen ber-atribut `hidden` tetap tampil selama class-nya mengatur `display`. Rule ini menjamin `[hidden]` selalu menang, di komponen manapun. */ [hidden] { display: none !important; } html, body { margin: 0; padding: 0; } html { -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; /* FIX v1.3.6: sebelumnya cuma yang dikasih background-color, dibiarkan default (transparan -> putih). Di PWA (standalone), area status-bar/notch di paling atas layar adalah bagian render sendiri, bukan chrome asli browser — jadi kalau tidak berwarna, area itu (dan celah sesaat saat cross-document View Transition swap body) balik ke putih default, kelihatan seperti "strip browser" kosong di atas header. Di tab browser biasa ini tidak kelihatan karena area itu ketutup address bar asli. Base color token (--color-bg) sudah didefinisikan tepat di selector [data-theme] yang nempel di ini (lihat themes.css), jadi cukup dipakai di sini juga, disamakan transisinya dengan body supaya ganti tema tetap mulus di kedua elemen bersamaan. */ background-color: var(--color-bg); transition: background-color var(--duration-theme) var(--ease-standard); /* Matikan efek "karet"/rubber-band saat overscroll di ujung halaman — ciri khas web yang paling kelihatan dibanding app native. Ditaruh di html & body sekaligus karena browser beda-beda soal siapa yang jadi scrolling box sungguhan untuk viewport utama. */ overscroll-behavior: none; /* Matikan gesture zoom bawaan browser (pinch & double-tap-to-zoom) di LEVEL CSS juga — pelengkap `maximum-scale=1, user-scalable=no` di meta viewport tiap halaman (lihat index.html/editor.html/dst), karena tidak semua browser 100% menghormati atribut viewport itu sendirian. */ touch-action: manipulation; } body { background-color: var(--color-bg); color: var(--color-text-primary); font-family: var(--font-ui); font-size: var(--text-base); line-height: var(--leading-snug); transition: background-color var(--duration-theme) var(--ease-standard), color var(--duration-theme) var(--ease-standard); min-height: 100vh; overflow-x: hidden; /* Redundan sengaja dengan rule di di atas — beberapa browser menganggap , bukan , sebagai scrolling box utama viewport, jadi overscroll-behavior perlu diset di keduanya supaya bounce-nya benar-benar mati di semua browser. */ overscroll-behavior: none; /* Matikan blok-pilih teks (long-press select / drag-select) di SELURUH halaman secara default — ciri khas web lain yang bikin kerasa kurang native. Sengaja ditaruh di sini (bukan cuma di halaman tertentu) biar berlaku otomatis di semua halaman baru ke depannya juga. Editor.html TETAP bisa select teks: .note-title-field/.note-body-field di editor.css sudah set user-select:text, dan selector class (0,1,0) otomatis menang atas selector element `body` ini (0,0,1) — jadi tidak perlu exception manual per halaman di sini. */ -webkit-user-select: none; user-select: none; } /* Sembunyikan scrollbar bawaan browser di SELURUH halaman & elemen apa pun yang bisa discroll (halaman itu sendiri, dropdown/panel, bottom sheet, strip horizontal, dsb) — konten tetap bisa discroll normal, cuma indikator scrollbar-nya yang disembunyikan. Berlaku global lewat `*` supaya konsisten di semua halaman & komponen sekaligus, tanpa perlu diulang manual di tiap file/komponen yang punya overflow:auto/scroll. */ html, * { scrollbar-width: none; /* Firefox */ -ms-overflow-style: none; /* IE / Edge lama */ } html::-webkit-scrollbar, *::-webkit-scrollbar { display: none; /* Chrome, Safari, Edge baru */ width: 0; height: 0; } a { color: inherit; text-decoration: none; /* Matikan "peek card" bawaan Safari/iOS yang muncul saat tautan (link hyperlink di isi catatan, kartu catatan, tombol FAB, dst) ditahan lama — di Android, context menu serupa ("Buka di tab baru"/"Salin Link") dimatikan lewat native-feel.js (event contextmenu), karena properti CSS ini WebKit/iOS-only. */ -webkit-touch-callout: none; } img, svg { display: block; max-width: 100%; /* Sama seperti pada `a` di atas: matikan card "Simpan Gambar" iOS saat gambar ditahan lama, plus cegah drag gambar keluar halaman (yang juga bisa memicu prompt simpan di sebagian browser desktop). Android ditangani lewat native-feel.js. */ -webkit-touch-callout: none; -webkit-user-drag: none; user-drag: none; } button { font-family: inherit; color: inherit; background: none; border: none; cursor: pointer; } input { font-family: inherit; color: inherit; background: none; border: none; outline: none; } ul { list-style: none; margin: 0; padding: 0; } /* Focus-visible ring — konsisten untuk keyboard navigation */ a:focus-visible, button:focus-visible, input:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; border-radius: var(--radius-xs); }