/* Luna components. One vocabulary: the design packet's class names (2026-11-09),
the engine's action hooks (`action action--{kind}`, `data-action`,
`data-row-id`, the section `data-*`) beside them, and the engine's parts the
packet does not draw (menus, the Day actions, tiles with tooltips, the graph).
Every value comes from tokens.css. The renderer and the client emit this
markup (COMPOSE.md); nothing here names a user, an area or a page.
Order: base · icons · brand · app and shell · rail · page and section · fold ·
table and row · menu · pill, glyph, area mark · buttons, chips, fields, switch ·
card · tiles and tooltips · status, toast, skeleton, empty · threads and composer ·
dump · band, login, prose, lists · companion · graph · motion · wide · floor. */
/* ===================================================================== base */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
overflow: hidden; /* .app is the scroller: its fixed children (sheets, toasts) then sit on the screen */
background: var(--bg); color: var(--text);
font: 400 var(--fs-md)/var(--lh-text) var(--font-text);
-webkit-font-smoothing: antialiased;
}
:where(h1, h2, h3, h4, p, ul, ol, pre, figure) { margin: 0; }
:where(ul, ol) { padding: 0; list-style: none; }
:where(button, input, textarea, select) { font: inherit; color: inherit; }
:where(button) { background: none; border: 0; padding: 0; cursor: pointer; }
:where(a) { color: var(--accent); text-decoration: none; }
:where(mark) { background: var(--warn-soft); color: inherit; border-radius: 3px; }
summary { cursor: pointer; list-style: none; }
summary::-webkit-details-marker { display: none; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
[hidden] { display: none !important; }
.visually-hidden {
position: absolute; width: 1px; height: 1px; overflow: hidden;
clip-path: inset(50%); white-space: nowrap;
}
.mono { font-family: var(--font-mono); font-size: var(--fs-xs); }
.num { font-variant-numeric: tabular-nums; }
/* ===================================================================== icons
: a mask painted in
currentColor (D-43). The packet's inline