/* base.css — part 1 of 6 of the app stylesheet.
   Holds: reset, scrollbars, the layering ladder, focus-visible, reduced motion.

   ORDER MATTERS. These files were cut out of a single app.css at line boundaries with the
   sequence preserved, so concatenating them in the order index.html links them reproduces the
   original byte for byte — which is what makes the cascade provably unchanged. Equal-specificity
   rules still resolve by source order, so reordering the <link> tags can change rendering.

   The names describe what ended up in each part, not a design: the original file interleaved
   the top bar, layout and per-feature rules, and moving rules to where they belong is a separate
   pass that this split exists to make possible. Palette is in theme.css, linked first. */
    /* Palette lives in theme.css (linked before this file). */


    /* Anvil demo re-skin: blue theme + wordmark logo */
    html.anvil { --brand:#0b3a8f; --brand-deep:#08265c; --brand-bright:#2f81f7;
      --accent:#1f6feb; --accent-press:#1a5fd0; --link:#1f6feb; }
    html.anvil[data-theme="dark"] { --brand:#8fc0ff; --brand-deep:#a7ccff; --brand-bright:#8fc0ff;
      --accent:#4a9bff; --accent-press:#3a86e0; --link:#8fc0ff; }
    .brand-icon.anvil-logo { height:32px; width:auto; border-radius:7px; background:#fff;
      padding:6px 12px; box-sizing:content-box; }

    /* Themed scrollbars (Firefox + WebKit/Blink) */
    * { scrollbar-width: thin; scrollbar-color: var(--scroll) transparent; }
    ::-webkit-scrollbar { width: 11px; height: 11px; }
    ::-webkit-scrollbar-track { background: transparent; }
    ::-webkit-scrollbar-thumb {
      background: var(--scroll); border-radius: 999px;
      border: 3px solid transparent; background-clip: padding-box;
    }
    ::-webkit-scrollbar-thumb:hover { background: var(--accent); background-clip: padding-box; }
    ::-webkit-scrollbar-corner { background: transparent; }
    * { box-sizing: border-box; }

    /* The layering ladder, in order, in one place (6.70.3). The values are unchanged — this is naming,
       not reordering — but they were previously twelve numbers scattered across the file, each chosen
       against whatever it happened to collide with. Making the top bar sticky in 6.69.0 meant reading all
       twelve to pick one, and then lifting the drawer and its scrim so the bar wouldn't overtake them.
       Reach for a name; if none fits, add one here rather than inventing a number at the call site.
       Two values are deliberately absent: .settings-tabs (2) and .pm-ms-list (5) sit inside their own
       stacking contexts, competing only with siblings, so a page-level token would misrepresent them. */
    :root {
      --z-menu: 50;         /* a menu opened from page content, e.g. the card row's ⋯ */
      --z-header-pop: 60;   /* a popover hanging off the top bar — above page menus */
      --z-crumb: 120;       /* the breadcrumb menu — above both of the above */
      --z-topbar: 130;      /* the sticky top bar — above every page-level menu */
      --z-scrim: 140;       /* the nav drawer's dim — covers the bar, as it did before the bar had a z-index */
      --z-drawer: 150;      /* the nav drawer itself */
      --z-overlay: 1000;    /* modals and toasts */
      --z-top: 1100;        /* the update banner, and .overlay-top */
    }

    /* Keyboard focus, app-wide (6.70.1). There was no :focus-visible rule anywhere, so controls relied on
       whatever the browser drew — inconsistent across engines, and invisible on anything that had its
       outline removed. :focus-visible rather than :focus so a mouse click doesn't leave a ring behind.
       The eight rules that swap the outline for an accent border are more specific and still win; this
       covers everything else, which is most of the buttons and links. */
    :focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
      border-radius: 3px;
    }

    /* Reduced motion (6.70.1). There was no such block, while the red security dot pulsed
       `infinite` — a light blinking in the corner of the screen for as long as a detection is open, for
       someone who has asked their system not to do that.
       The !important is deliberate and is the reason this is the exception to keeping the cascade clean:
       it has to beat any animation added later, including ones written after this rule. Global rather
       than a list of selectors for the same reason — a list would rot the next time something animates.
       Colour and layout are untouched, so every state is still fully conveyed; only the movement stops. */
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
      }
    }
    body {
      margin: 0; background: var(--bg); color: var(--text);
      font: 15px/1.5 -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
    }