/* TigoMeNote · base.css — reset at typography */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.5;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  transition: background-color .2s var(--ease), color .2s var(--ease);
}
h1, h2, h3, h4 { font-family: var(--font-display); line-height: 1.15; margin: 0; letter-spacing: -0.02em; font-weight: 700; }
h1 { font-size: clamp(28px, 4vw, 40px); }
h2 { font-size: 22px; }
h3 { font-size: 17px; }
p { margin: 0; }
a { color: inherit; text-decoration: none; }
img, svg, video { display: block; max-width: 100%; }
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 6px; }
/* Phone: walang asul na highlight kapag nag-tap (link, button, photo, status), at walang asul na "select" kapag nag-swipe.
   Hindi ginalaw ang long-press sa link (Open in new tab) at ang pag-select ng text sa caption, comments at chat. */
html { -webkit-tap-highlight-color: transparent; }
:focus:not(:focus-visible) { outline: none; }
button, [role="button"], [role="tab"], nav, .sidebar, .bottom-nav, .topbar,
img, video, canvas, svg, .pcard-media, .pc-track, .st-bar, .st-view, .st-ring, .mv, .vp, .tg-stage, .avatar, .chip, .segmented {
  -webkit-user-select: none; user-select: none;
}
img { -webkit-user-drag: none; }
::selection { background: var(--accent); color: #fff; }

.muted { color: var(--text-2); }
.faint { color: var(--text-3); }
.small { font-size: 13px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hidden { display: none !important; }

/* Icon helper: <svg class="ic"> */
.ic { width: 20px; height: 20px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ic-sm { width: 16px; height: 16px; }
.ic-lg { width: 26px; height: 26px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ---------- Arabic / right-to-left (i18n.js nagse-set ng <html dir="rtl">) ---------- */
[lang="ar"] body { font-family: var(--font-body, Inter), "Segoe UI", Tahoma, "Noto Sans Arabic", "Geeza Pro", Arial, sans-serif; }
[lang="ar"] * { letter-spacing: 0 !important; }   /* hindi pwedeng may letter-spacing ang Arabic (napuputol ang letra) */
[dir="rtl"] { text-align: right; }
[dir="rtl"] .pc-who .faint, [dir="rtl"] .sx-user .faint, [dir="rtl"] #pUser, [dir="rtl"] .user-card .faint,
[dir="rtl"] .sx-pname .faint, [dir="rtl"] .pv-author .faint, [dir="rtl"] .brand, [dir="rtl"] #storeUsed, [dir="rtl"] .q-sub { unicode-bidi: plaintext; }
[dir="rtl"] .brand { direction: ltr; }
/* Laman ng users (pwedeng English/Tagalog sa Arabic na page): sariling direksyon bawat talata */
.pc-caption, .pv-cap, .sx-cbody, .sx-bio, .profile-bio, .st-cap, .q-title, .profile-name, .pc-who b, .sx-user b { unicode-bidi: plaintext; }

/* ---------- APK "app mode" (app-mode.js): parang app, hindi website ---------- */
.in-app body { -webkit-tap-highlight-color: transparent; overscroll-behavior-y: none; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.in-app input, .in-app textarea, .in-app [contenteditable], .in-app .selectable { -webkit-user-select: text; user-select: text; }
.in-app img { -webkit-user-drag: none; }