/* View switcher — a quiet icon strip, not a navbar.
   Standalone on purpose: the alternative views keep their own original designs and do
   not load theme.css, so every token here has a literal fallback. On pages that do load
   theme.css the tokens win and the rail matches the orange card system.
   Rendered by views.js into <nav id="viewrail"></nav>.
   ponytail: one small stylesheet beats five copies of the same rules. */

.viewrail{display:flex;gap:2px;align-items:center;
  font-family:var(--sans,Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif)}
.vr-item{display:flex;align-items:center;gap:8px;padding:9px;border-radius:8px;
  color:var(--t3,#5c6778);text-decoration:none;border:1px solid transparent;line-height:0}
.vr-item svg{display:block;flex:none}
a.vr-item:hover{color:var(--t1,#111a24);background:var(--fill,#f2f4f7);text-decoration:none}
.vr-item[aria-current="page"]{color:var(--orange-text,#8f4600);
  background:var(--orange-tint,#fff4e8);border-color:var(--orange,#f6821f)}
.vr-item:focus-visible{outline:3px solid var(--line-strong,#767f8c);outline-offset:2px}

/* The text label is the accessible name; it is shown only when there is room for it,
   never hidden with display:none (which would take it from screen readers too). */
.vr-label{font-size:14px;font-weight:500;line-height:1.2;
  position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Narrow: a small horizontal strip of icons, out of the way at the top. */
@media (max-width:1399px){
  .viewrail{padding:6px 16px;background:var(--card,#fff);
    border-bottom:1px solid var(--line,#dce0e6);position:sticky;top:0;z-index:35;
    justify-content:flex-end}
}

/* Wide: a narrow vertical strip pinned to the left edge, in the gutter. */
@media (min-width:1400px){
  body{padding-left:64px}
  .viewrail{position:fixed;left:10px;top:50%;transform:translateY(-50%);
    flex-direction:column;gap:4px;padding:8px 7px;z-index:35;
    background:var(--card,#fff);border:1px solid var(--line,#dce0e6);
    border-radius:12px;box-shadow:0 2px 8px rgba(17,26,36,.08)}
}

@media print{ .viewrail{display:none} }