/* AiB Platform — global primitives shared by every surface.
   Reset, focus discipline, the .mono voice, the .ul link and the AıB wordmark.
   Loaded after tokens.css, before any surface stylesheet. */

* { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  /* The viewport never pans sideways: sticky chrome (topbar, public band)
     rides along with body-level horizontal overflow, which reads as menus
     drifting. Wide things scroll inside their own boxes (.table-scroll,
     .board); clip — not hidden — so no scroll container is created and
     position: sticky keeps working. */
  overflow-x: clip;
  /* and touch overscroll never rubber-bands sideways either */
  overscroll-behavior-x: none;
}

body {
  /* iOS Safari exempts the ROOT from overflow clipping when panning the
     visual viewport — content wider than the page stays reachable by touch
     no matter what html declares. Clipping the body box is an ordinary
     element clip iOS honors, so a runaway child can never widen the page.
     Fixed-position chrome (drawer, scrim, modals) is exempt by spec: its
     containing block is the viewport, not body. */
  overflow-x: clip;
}

body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh; /* mobile URL bars: the real viewport, not the largest */
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 14.5px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }

[x-cloak] { display: none !important; }

.mono {
  font-family: var(--font-mono);
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ul { border-bottom: 1px solid currentColor; padding-bottom: 2px; transition: opacity 0.3s; }
.ul:hover { opacity: 0.6; }

/* ---------- the mark: AıB with the sodium tittle ---------- */
/* Color is inherited (aib-site convention): the mark wears the room's ink —
   white in the night sidebar and public band, ink on paper and the topbar. */
.mark {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 21px;
  letter-spacing: -0.02em;
  line-height: 1;
  white-space: nowrap;
}
.mark .mi { position: relative; }
.mark .mi::after {
  content: '';
  position: absolute;
  left: 50%;
  /* ported from aib-site chrome.css. Sofia Sans 800 geometry (upm 1000,
     ascent 900): the real tittle spans y=[570,690], the stem caps at y=488;
     top 0.17em bottom-aligns this oversized dot with the tittle (bottom
     y=575) so it floats in the gap. The old 0.30em sank it onto the stem. */
  top: 0.17em;
  width: 0.155em;
  height: 0.155em;
  border-radius: 50%;
  background: var(--sodium);
  transform: translateX(-50%);
  animation: mark-pulse 3.2s ease-in-out infinite;
}
.mark-suffix {
  font-family: var(--font-mono);
  font-weight: 400;
  font-size: 0.34em;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  opacity: 0.55; /* inherits the mark's ink, dimmed — reads on any ground */
  margin-left: 0.6em;
}
@keyframes mark-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 164, 59, 0.55); }
  50%      { box-shadow: 0 0 0.28em 0.06em rgba(255, 164, 59, 0.22); }
}

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