/*
 * A landmark is a REGION, not a look: it states the layout its children were
 * written against — the `View` column it replaced — and paints nothing. Every
 * size, ground and edge stays the caller's, because a page's own chrome is what
 * a landmark holds.
 *
 * `border` is the one edge property it must still STATE, at zero width. A page's
 * chrome rules are the caller's, and a caller states a width and a colour; the
 * initial border-style is `none`, so a width alone paints nothing and there is
 * nothing to see. Declaring the style here — never a width — is what makes the
 * caller's two properties a line.
 */
@layer theme, base, lotics, components, utilities;
@layer lotics.tokens, lotics.reset, lotics.components;

@layer lotics.components {
  .lotics-landmark {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    position: relative;
    border: 0 solid var(--border);
    min-width: 0;
    min-height: 0;
    flex-shrink: 0;
  }
}