/* ══ base.css — loaded by EVERY page before its own stylesheet ══
   One place for the rules that must be identical everywhere, so a page with
   its own CSS file can't drift (user decision 2026-09-09):

   • no browser tap-flash / long-press highlight on any control
   • nothing is selectable EXCEPT the AI's replies (and the Select-text sheet)
   • where text IS selectable, the highlight is the brand green, never blue
   • the address bar is tinted to the app paper colour (meta theme-color is
     set per page; this file carries the matching CSS colours)              */

:root {
  --sel-bg: rgba(30, 107, 82, .28);    /* brand green at selection opacity */
  --sel-fg: #191919;
  accent-color: #1e6b52;               /* native checkboxes, radios, progress */
  caret-color: #1e6b52;                /* text cursor in inputs */
}

/* no blue tap-flash anywhere (Android Chrome / iOS Safari) */
* { -webkit-tap-highlight-color: transparent; }
/* stop iOS/Android callout + drag-select on long-press of UI chrome */
a, button, label, summary, [role="button"], .icon, svg, img {
  -webkit-touch-callout: none;
}

/* Nothing selectable by default… */
html, body {
  -webkit-user-select: none;
  user-select: none;
}
/* …except typing fields (needed for cursor placement) and the AI reply. */
input, textarea, [contenteditable="true"],
.md, .md *,                       /* assistant markdown (index.html) */
.bs-pre.selectable {              /* "Select text" sheet */
  -webkit-user-select: text;
  user-select: text;
}
/* the user's own bubble is deliberately NOT selectable: long-press it → menu */
.msg.user .md, .msg.user .md * { -webkit-user-select: none; user-select: none; }

/* Selection colour: brand green wherever selection is allowed. Written on
   :root so highlight inheritance (Chrome 134+) carries it everywhere; the
   explicit rules below are for older engines that don't inherit. */
:root::selection { background: var(--sel-bg); color: var(--sel-fg); }
::selection { background: var(--sel-bg); color: var(--sel-fg); }
::-moz-selection { background: var(--sel-bg); color: var(--sel-fg); }
input::selection, textarea::selection { background: var(--sel-bg); color: var(--sel-fg); }

/* focus ring for keyboard users stays, in brand colour, never the UA blue */
:focus { outline: none; }
:focus-visible { outline: 2px solid #1e6b52; outline-offset: 2px; }
input:focus-visible, textarea:focus-visible { outline: none; }
