/* ─────────────────────────────────────────────────────────────────────
   QueueWhiz · "Track"

   ONE global stylesheet, deliberately. Blazor scoped CSS stamps a
   b-<hash> attribute onto every element it owns, which would leave the
   exact-markup assertions in WaitTimes.Web.Tests matching nothing and
   PASSING FOR THE WRONG REASON. See the design doc, decision 1.
   Do not add *.razor.css files.
   ───────────────────────────────────────────────────────────────────── */

@font-face{font-family:'Space Grotesk';font-weight:500;font-display:swap;src:url('lib/fonts/space-grotesk-500.woff2') format('woff2')}
@font-face{font-family:'Space Grotesk';font-weight:600;font-display:swap;src:url('lib/fonts/space-grotesk-600.woff2') format('woff2')}
@font-face{font-family:'Space Grotesk';font-weight:700;font-display:swap;src:url('lib/fonts/space-grotesk-700.woff2') format('woff2')}
@font-face{font-family:'InterVar';font-weight:400;font-display:swap;src:url('lib/fonts/inter-400.woff2') format('woff2')}
@font-face{font-family:'InterVar';font-weight:500;font-display:swap;src:url('lib/fonts/inter-500.woff2') format('woff2')}
@font-face{font-family:'InterVar';font-weight:600;font-display:swap;src:url('lib/fonts/inter-600.woff2') format('woff2')}

:root{
  --page:#F4F6F8; --surface:#FFFFFF; --ink:#0E1419; --muted:#5E6B75; --faint:#8A96A0;
  --hair:#EDF0F3; --edge:#E3E8EC; --structure:#A3AEB6; --ground:#CDD5DB;
  --rail-faint:#C7D0D8; --signal:#E5372B; --calm:#127A55; --cursor:#2563EB;
  --display:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;
  /* One size for the wordmark and for every page title, because they are meant
     to be the same size -- a token, not two numbers that happen to agree today.
     Set them separately and the next person to nudge one has no way of knowing
     the other was supposed to follow. */
  --title:19px;
  --text:'InterVar',ui-sans-serif,system-ui,-apple-system,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--page);color:var(--ink);font-family:var(--text);font-size:15px;line-height:1.5}

/* shell */
.qw-header{background:var(--surface);border-bottom:1px solid var(--edge)}
/* 1040, not 760: the plots are the point of this site and at 760 they sat in a
   narrow strip down the middle of a wide monitor. Everything here is fluid, so
   this is a ceiling rather than a layout — a phone is unchanged. The row TABLES
   do not take all of it (see .qw-rows below); the band and the chart do. */
.qw-header-inner,.qw-main,.qw-footer-inner{max-width:1040px;margin:0 auto;padding:0 15px}
/* baseline, not center. The wordmark is 19px and the nav links 10.5px, so
   centring their BOXES left the two sets of type sitting on different lines --
   measured 4.4px apart. On baseline they sit on one, which is what a banner
   should read as. The residual 3px between their text rects is the 19px font's
   deeper descender, not misalignment. */
.qw-header-inner{display:flex;align-items:baseline;justify-content:space-between;padding-top:12px;padding-bottom:12px}
.qw-wordmark{font-family:var(--display);font-weight:700;font-size:var(--title);letter-spacing:-.035em;
             line-height:1;color:var(--ink);text-decoration:none;white-space:nowrap}
.qw-wordmark .qw-w{color:var(--signal)}
/* The ride standing in for the "i". Ground line lands on the text baseline and
   the car overshoots the cap line, exactly as a tittle does. Height is below the
   font's ascender so the line box never clips it. */
.qw-i{display:inline-block;height:.95em;width:1em;vertical-align:-.09em;margin:0 -.02em;
      color:inherit;overflow:visible}
.qw-navlink{font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--faint);
            font-weight:600;text-decoration:none}
.qw-navlink:hover{color:var(--muted)}
.qw-main{padding-bottom:28px}
.qw-footer{border-top:1px solid var(--edge);margin-top:24px;background:var(--surface)}
.qw-footer-inner{padding-top:12px;padding-bottom:16px;font-size:10.5px;color:var(--faint);letter-spacing:.03em}
/* Centred. The colophon line that used to sit above this is gone, and with it
   the rule that separated the two -- there is nothing left up there to divide
   from. margin:0 auto is what centres the BLOCK once it has a measure; without
   it text-align would centre the lines inside a box still sitting hard left. */
.qw-disclaimer{max-width:78ch;margin:0 auto;text-align:center;line-height:1.6;letter-spacing:0}
/* An <h2> for the document outline -- a screen reader should be able to find
   this section -- but sized like the eyebrow labels rather than like a heading,
   since it titles four lines of small print at the bottom of a page. */
.qw-disclaimer h2{font-family:var(--display);font-size:10.5px;font-weight:700;
                  letter-spacing:.11em;text-transform:uppercase;color:var(--muted);
                  padding-top:0;margin-bottom:5px}
.qw-disclaimer p{margin:0 0 7px}
.qw-disclaimer p:last-child{margin-bottom:0}
.qw-disclaimer a{color:var(--signal);text-decoration:none}
.qw-disclaimer a:hover{text-decoration:underline}

/* typography */
/* The same size as the wordmark, deliberately: the title is the last step of the
   trail it sits on, not a banner of its own, and at 26px it outshouted the
   masthead. Same tracking too, so the two read as one typeface at one size in
   two places. */
h1{font-family:var(--display);font-size:var(--title);font-weight:700;letter-spacing:-.035em;line-height:1.12;padding-top:16px}
h2{font-family:var(--display);font-size:16px;font-weight:600;letter-spacing:-.02em;padding-top:14px}
.qw-sub{font-size:12px;color:var(--muted);margin-top:7px}
/* Under the title, not above it: the page says what it is first, and the trail
   out of it second. Its top margin is the 7px .qw-sub used in that slot, so the
   line under an h1 sits where a reader's eye already expects one; the 14px
   below is the separation the first card needs, which nothing else supplies —
   .qw-card carries no top margin of its own. */
/* Title and trail on one line. The trail is a real <nav> and the title a real
   <h1> -- they are not nested, only aligned -- so the landmark stays a landmark
   and the heading stays a heading. Baseline alignment is what seats 11.5px
   crumbs on a 26px title's baseline; flex-wrap is what lets a long name drop to
   its own line on a phone instead of squeezing the trail. */
.qw-page-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 8px;
              padding-top:16px;margin-bottom:16px}
.qw-page-head h1{padding-top:0}
.qw-page-head .qw-crumb{margin:0}
.qw-crumb{font-size:11.5px;color:var(--faint);display:flex;
          align-items:baseline;gap:7px;flex-wrap:wrap}
/* One rule, not two: this was declared identically twice, thirty lines apart. */
.qw-crumb a{color:var(--signal);text-decoration:none}
.qw-crumb a:hover{text-decoration:underline}
.qw-crumb-sep{color:var(--rail-faint)}
/* Section headings. These are real <h2>s — heading navigation is how a screen
   reader user moves around /status — so font-family is restated here to hold
   the eyebrow look against the h2 rule above rather than inheriting --display. */
.qw-sect{font-family:var(--text);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
         color:var(--faint);
         font-weight:600;padding:16px 0 7px;display:flex;justify-content:space-between;align-items:baseline}
.qw-sect em{font-style:normal;letter-spacing:.02em;text-transform:none;font-size:11px}

/* content surfaces. The rule, settled 2026-08-29: a card goes around a TABLE
   (the ride list, the front page's grouped list, every table on /status) and
   around a COMBINED informational topic — several related facts bundled into
   one thing, the way the weather module bundles an icon, a conditions sentence
   and an optional staleness note. A single heading, a lone paragraph or a
   headline figure standing alone is neither, and stays on the page ground —
   .qw-now's 50px current-wait figure is the test case: it is one fact with a
   unit and a caption, not several bundled together, so it is not boxed even
   though .qw-stats three cells below it is. See the design doc, decision 13. */
.qw-card{background:var(--surface);border:1px solid var(--edge);border-radius:10px;overflow:hidden}
.qw-card + .qw-card{margin-top:10px}
/* A card holding prose rather than a table needs its own padding: a table
   brings padding with its cells, a paragraph does not. This is the "combined
   informational topic" half of decision 13 -- the weather module is its only
   caller today. */
.qw-card-pad{padding:11px 14px 13px}
.qw-card-pad > *:first-child{margin-top:0}

/* The park-details card: one fact per row, each an icon, the fact, and an
   optional right-hand note. Rows here are the same shape as rows in a table
   above — thing on the left, condition on the right — so the card reads as part
   of the same page rather than as prose that happens to be boxed. */
.qw-facts{padding:4px 0}
.qw-fact{display:flex;align-items:center;gap:10px;padding:7px 14px;font-size:12.5px;
         color:var(--muted);margin:0}
.qw-fact + .qw-fact{border-top:1px solid var(--hair)}
/* A FIXED, CENTRED slot, which is the whole alignment fix. These icons are
   emoji: they carry their own side bearings, their own baselines, and their own
   widths, so setting them inline left the text starting at a different x on
   every row and sitting a pixel or two off the glyph. A fixed box with the row
   centred against it makes the icon's own metrics irrelevant. */
.qw-fact-icon{flex:0 0 18px;width:18px;text-align:center;font-size:15px;line-height:1}
.qw-fact-text{flex:1;min-width:0}
.qw-fact-meta{color:var(--faint);font-size:11px;white-space:nowrap;text-align:right}
.weather-stale .qw-fact-text{font-style:italic}

/* The card header, decision 13. Name on the left in ink, condition on the right
   in --faint, hairline rule beneath. Every card on every page names itself the
   same way, inside its own border.

   THE RULE IS NOT DECORATION. One card's header -- the never-reported
   disclosure -- is a button, and a button needs a visible edge between the thing
   you click and what appears when you do. Giving that card a rule and withholding
   it from the others would make the disclosure a special case; giving it to all
   four makes it ordinary. The tint is deliberately almost nothing: the rule does
   the work, and a heavier fill would turn every card into a titlebar.

   The qualifier slot exists to absorb chrome the cards were carrying awkwardly
   somewhere else -- the band's "last 24 h" out of its axis caption, the ride
   list's "longest first" out of its <caption>, the disclosure's count out of its
   sentence. */
/* The front page's section heading, and the tools that sit on its line: the
   search field and the count. Same shape as a card header -- name left, chrome
   right -- but on the page ground, because it titles a run of cards rather than
   the contents of one. */
.qw-section-head{display:flex;justify-content:space-between;align-items:baseline;
                 gap:14px;flex-wrap:wrap;margin:22px 0 10px}
.qw-section-head h2{margin:0}
.qw-section-tools{display:flex;align-items:baseline;gap:12px}
.qw-section-count{font-size:10.5px;color:var(--faint);white-space:nowrap;
                  font-variant-numeric:tabular-nums}
/* Load-bearing, same trap as .qw-sort: display:flex would override the hidden
   attribute the markup ships with and expose a field no script is driving. */
.qw-search[hidden]{display:none}
.qw-search{display:flex}
.qw-search-input{font-family:inherit;font-size:12px;color:var(--ink);
                 background:var(--surface);border:1px solid var(--edge);
                 border-radius:7px;padding:5px 10px;width:190px;
                 -webkit-appearance:none;appearance:none}
.qw-search-input::placeholder{color:var(--faint)}
.qw-search-input:focus{outline:none;border-color:var(--structure);
                       box-shadow:0 0 0 3px rgba(229,55,43,.10)}
.qw-search-empty{font-size:12px;color:var(--muted);padding:14px 2px;margin:0}

.qw-card-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
              padding:10px 14px;border-bottom:1px solid var(--edge);background:#FCFDFE}
.qw-card-head > b{font-family:var(--display);font-size:13.5px;font-weight:600;
                  letter-spacing:-.015em;color:var(--ink)}
.qw-card-head > span{font-size:10.5px;color:var(--faint);text-align:right;white-space:nowrap}
/* "Recently viewed" carries no accent. It was --signal for a day, on the
   argument that it is the one card about the reader rather than about the
   parks; on the page it read as a warning rather than as a favourite, and the
   accent is worth more kept for the one thing it marks everywhere else -- the
   control a reader can change. The card is distinguished by its position and
   its name, which is enough. */
/* The attraction list's sort control, which lives in the right-hand slot of a
   card header beside the count that was already there. Header type sizes are
   inherited from the rule above rather than restated, so the buttons sit on the
   same line as the note without a second set of numbers to keep in step. */
.qw-head-right{display:flex;align-items:baseline;gap:12px}
.qw-sort{display:flex;align-items:baseline;gap:10px}
/* Load-bearing. .qw-sort sets display:flex, which would otherwise override the
   hidden attribute the markup ships with and expose the buttons to readers with
   no script -- the exact thing the attribute is there to prevent. */
.qw-sort[hidden]{display:none}
.qw-sort-btn{font-family:inherit;font-size:10.5px;background:none;border:0;padding:0;
             cursor:pointer;color:var(--faint)}
.qw-sort-btn:hover{color:var(--muted)}
/* The active sort is the one thing in a card header that earns the accent: it
   is the only state in the header a reader can change, and the arrow beside it
   says which way it runs. Inactive controls stay the faint the rest of the
   header is set in, so the accent marks one thing rather than the whole slot. */
.qw-sort-btn[aria-pressed="true"],
.qw-sort-btn[aria-pressed="true"]:hover{color:var(--signal);font-weight:600}
.qw-sort-arrow{margin-left:3px}
.qw-sort-btn:focus-visible{outline:2px solid var(--signal);outline-offset:3px;border-radius:2px}
/* The disclosure's header IS the control, so it carries the affordance and the
   pointer; every other card's header is inert. */
details.qw-card > summary.qw-card-head{cursor:pointer;list-style:none}
details.qw-card > summary.qw-card-head::-webkit-details-marker{display:none}
details.qw-card > summary.qw-card-head > b::before{content:"▸";color:var(--faint);
                  font-size:9px;margin-right:7px;display:inline-block}
details.qw-card[open] > summary.qw-card-head > b::before{content:"▾"}
/* A table that has given its visible title to a card header names itself with
   aria-labelledby pointing at that header. NOT a visually-hidden <caption>:
   hiding one with position:absolute makes it compute to display:block, at which
   point it is no longer a table-caption and Chrome's fixed-layout algorithm
   discards the column widths entirely — every column becomes an equal third.
   Measured, not theorised. */

/* rows. The value cell is a FIXED width: sized to content it is narrow for "70"
   and wide for "CLOSED", which shifts the plot column left on exactly the rows
   whose plot is already unusual. See decision 12. */
/* A row is a name, a plot and a number, and the plot and the number are fixed
   widths — so all of a wider shell lands in the name column. At 1010 that put
   the name hard left and the number hard right with a desert between them, which
   is harder to read than the narrow page was, not easier. The row tables
   therefore stop at a readable measure while the drawings — the band and the
   attraction chart — do take the whole width. Left-aligned
   rather than centred, so the caption and the names stay on the same left edge
   as the heading above them. 760 is the shell's own former ceiling, so a row is
   the width it has always been and this widening cannot regress one.
   /status is the exception: its tables are seven columns of real data and want
   every pixel. They used to be identified as "the .qw-rows inside a .qw-card",
   which stopped being true the moment decision 13 put every table in a card —
   the front page's park list would have silently lost the cap this paragraph
   argues for. Width is now stated by .qw-wide and says nothing about surface.

   A row table that HAS a plot column is the other exception, and for the same
   reason: the cap is about a name and a number with a desert between them, and a
   plot is not a desert. So the ride list runs the shell's full 1010, which is
   also what keeps its right edge on the band's — the list ending short of the
   drawing above it has been reported as a defect twice.

   Selected on `:has(.qw-plot)` rather than on a new class so the rule states its
   own condition: the front page's park list is a name-and-number table, has no
   plot, and keeps the 760 cap, which for it is still right.

   WHICH COLUMN IS THE FLUID ONE is the whole layout. It used to be the name:
   name auto, plot 326, figure 64, so every pixel a wider shell gave the table
   landed in the name column and 1010 left the name 620 px wide for a longest
   ride name of 277. That is the desert the cap above exists to prevent, rebuilt
   inside the row — the project owner reported it from the rendered page. It is
   now the other way round: the NAME is fixed at what a name needs and the PLOT
   takes the remainder, so the reclaimed width buys sparkline, and it goes on
   buying sparkline as the shell narrows instead of the name hoarding it.

   400 px for the name is measured rather than picked. The longest ride name in
   the seeded data ("Jim Button – Journey through Morrowland") is 277 px in this
   cell's own font, the longest status line beside it is 147 px, and 400 less the
   28 px of cell padding leaves 372 px — about 55 characters, which 5 815 of the
   5 825 attractions currently carrying a wait figure fit on one line. The ten
   that do not wrap to two lines and make their own row taller, which is what the
   name column has always done when it ran out of room.

   The never-reported disclosure below the list is aligned to the same 1010 by
   `.qw-hidden-rides` further down, which is a deliberate exception to the
   paragraph above — see the comment there. */
table.qw-rows{width:100%;max-width:760px;border-collapse:collapse;table-layout:fixed}
/* Opt IN to full width, rather than inheriting it from being in a card. A card
   is a surface; how wide a table wants to be is a separate question, and tying
   the two meant one visual change could move a layout. */
table.qw-rows.qw-wide{max-width:none}
table.qw-rows caption{text-align:left;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
                      color:var(--faint);font-weight:600;padding:0 0 7px}
.qw-rows td{padding:9px 14px;border-bottom:1px solid var(--hair);vertical-align:middle}
.qw-rows tr:last-child td{border-bottom:0}
.qw-name{font-family:var(--display);font-size:14px;font-weight:600;letter-spacing:-.018em;line-height:1.2}
.qw-name a{color:inherit;text-decoration:none}
.qw-name a:hover{text-decoration:underline}
.qw-meta{display:block;font-size:10.5px;color:var(--faint);margin-top:4px}
/* td.qw-plot, not .qw-plot: `.qw-rows td` above is (0,1,1) and this rule was
   (0,1,0), so the padding reset it has always declared never actually won and
   the cell kept 14 px each side. That did not show while the SVG drew at its own
   62 px width and simply overhung the right padding; the moment it became fluid
   below it did, as a plot 28 px narrower than its column. */
.qw-rows td.qw-plot{display:none}
/* Not a row-height rule but a row-height BUDGET, so it belongs with the widths
   above. `.qw-rows td` gives every cell 9 px top and bottom, which is right for
   text and wrong for a drawing that already carries its own margins in the
   viewBox: the padding does not make the plot more legible, it only spends the
   height that decides how wide the plot may be. A row is 61.25 px tall, set by
   the name cell (a 22.5 px line box, a 4 px gap, a 15.75 px status line and 18
   px of padding); the plot scales UNIFORMLY, so every pixel of width it gains
   is also height. Measured in Chrome by widening the column until the rows
   actually grew, rather than computed and hoped for: with the 9 px padding the
   rows start growing between 450 and 460 px of plot, and with it gone between
   640 and 650. The cap below asks for 546 — inside the second and outside the
   first, so the padding is precisely what would have stopped this layout using
   the width the 1010 shell has to give. */
/* height:auto is what keeps preserveAspectRatio's default "meet" scaling the
   plot UNIFORMLY once the cell is visible: the dots are circles and a
   non-uniform scale turns them into ellipses, which is why
   preserveAspectRatio="none" is not an option here. The authored 300x28
   viewBox is therefore an aspect RATIO as much as a size, and it is the one
   ParkDetail.razor now authors — there used to be a second, 124x28 one for a
   phone's 76 px column, shown by a media query below the one that widens this
   one; the project owner looked at that drawing and called it too small to
   read anything from, so it is gone, and `td.qw-plot{display:none}` above
   removes the column's width along with it rather than leaving a plot too
   small to matter — the row falls back to name, status and the wait figure,
   which is what a phone reader needs anyway. */
.qw-plot svg{display:block;width:100%;height:auto}
/* One media query, and the only one in this file. There is still no second
   drawing for it to switch between — only whether the column exists at all —
   but the question it answers has changed with the layout above. The plot is no
   longer pinned at 326 px whatever the shell does; it is the fluid column, so it
   NARROWS as the viewport does and there is a real width at which it stops being
   worth its space. That width is the breakpoint.

   Found by looking at the built page at 1:1 — the ride list at 800 px with the
   plot column forced to a series of fixed widths, so the screenshots were not
   being scaled by the pane and a "readable" judgement meant something. At 260 px
   the shape, the hatch and the support columns all read plainly. At 230 px the
   line is still legible as a shape. At 200 px it is cramped, and at 170 px it is
   the smudge the project owner already rejected once — a 300-unit drawing at
   170 px is 0.57 px per unit, thinner than the 124-unit drawing at 76 px (0.61)
   that was removed for exactly this reason. 230 px is therefore the floor.

   The breakpoint is that floor plus everything the row spends before it:
   230 plot + 350 name + 64 figure + 30 shell padding = 674. It is not a round
   number on purpose — the previous 860 was, and was 136 px too early. It moved
   from 724 to 674 when the name column gave up 50 px, because the threshold is
   derived from the columns rather than chosen beside them. Below 724
   the column is hidden outright rather than shrunk further, and the row falls
   back to name, status and the wait figure, which is what a phone reader needs
   anyway. The cell is aria-hidden, so a screen-reader user loses nothing at all.

   The plot column carries no width and is the auto one, because `calc()` is
   dropped to auto by table-layout:fixed anyway (checked in Chrome on 2026-08-29,
   alongside clamp() and min()/max() wrapping the same calc; a bare percentage is
   the only fluid form that survives). Being the table's one auto column gets the
   remainder honestly, which is what a calc would have been trying to say. */
@media (min-width:674px){
  table.qw-rows:has(.qw-plot){max-width:1010px}
  /* The name is the fixed column and the plot takes the rest; below the query
     the name goes back to auto, which is what a phone wants. */
  .qw-rows:has(.qw-plot) td:first-child{width:350px}
  .qw-rows td.qw-plot{display:table-cell;padding:0}
}
/* td.qw-value, NOT .qw-value: `.qw-rows td` above is (0,1,1) and the bare class
   is (0,1,0), so this padding-left:0 never applied -- the column has carried
   14 px of dead left padding since it was written, leaving 36 px of content
   where 50 was intended. That is what made "no standby figure" stack into three
   lines. Exactly the trap the td.qw-plot rule above already records.
   76 px is measured, not chosen: the widest caption is NO FIGURE at 53.1 px, and
   76 less the 14 px right padding clears it on one line with air to spare. */
.qw-rows td.qw-value{width:76px;text-align:right;padding-left:0}
.qw-num{font-family:var(--display);font-size:23px;font-weight:700;letter-spacing:-.045em;
        line-height:.9;font-variant-numeric:tabular-nums;display:block}
.qw-unit{display:block;font-size:8px;letter-spacing:.12em;color:var(--faint);margin-top:4px;font-weight:500}
/* A cell with no figure keeps the shape of one that has a figure: a glyph on the
   number's own line, and a caption beneath it in the slot MIN occupies. The dash
   matches .qw-num's metrics so the two kinds of row sit on one baseline down the
   column -- before this, a status was 10 px lowercase text at the cell's vertical
   centre, a full 12 px below where every number sat, and the states did not read
   as one family. The dash is a placeholder rather than information, so it takes
   its colour from the state and never from the busy/calm scale. */
.qw-dash{font-family:var(--display);font-size:23px;font-weight:700;line-height:.9;
         display:block;color:var(--rail-faint)}
.qw-label{display:block;font-size:8px;letter-spacing:.12em;color:var(--faint);
          margin-top:4px;font-weight:600}
.qw-row-busy .qw-num{color:var(--signal)}
.qw-row-calm .qw-num{color:var(--calm)}
/* A down ride is marked once, in the column the eye scans, at the size the eye
   scans it at. The status line under the name used to go red and bold as well,
   which put two different reds at two different sizes on one row and still left
   the loudest slot on it saying nothing. */
.qw-row-down .qw-dash,.qw-row-down .qw-label{color:var(--signal)}
/* Closed rides stay legible. This was .48, which dimmed the name past reading
   and took the sparkline -- real history, and the only place it is drawn -- most
   of the way to invisible along with it. The row still recedes; it no longer
   disappears. */
.qw-row-shut{opacity:.62}
.qw-row-shut .qw-dash,.qw-row-shut .qw-label{color:var(--muted)}

/* the park band */
/* The band no longer draws its own surface: it sits inside a .qw-card that
   carries the border, the radius and the header (decision 13). Keeping both
   would have drawn a box inside a box. position:relative stays — the scrub
   cursor positions against it. */
/* The left gutter is the value axis's. Only the two band surfaces use
   .qw-band -- row sparklines are td.qw-plot and deliberately have no axis, so
   nothing else pays for this padding. 30px holds three digits at 8.5px plus the
   7px the labels stand off the plot by. */
.qw-band{padding:12px 14px 0 30px;position:relative}
/* The plot's own box, which the value labels are positioned against: a label at
   top:N% has to be a percentage of the DRAWING, not of the padded card. */
.qw-band-plot{position:relative}
.qw-band-values{position:absolute;inset:0;pointer-events:none}
/* right:100% puts each label in the gutter to the left of the plot, and the
   translate seats it on its own gridline rather than hanging below it. */
.qw-band-values span{position:absolute;right:100%;margin-right:7px;
                     transform:translateY(-50%);font-size:8.5px;line-height:1;
                     color:var(--faint);white-space:nowrap;font-variant-numeric:tabular-nums}
.qw-band-card{margin-top:14px}
/* height:auto is what makes width:100% mean anything. With the height attribute
   Track.razor emits left in force, preserveAspectRatio's default "meet" scaled
   the viewBox to fit a box that height and CENTRED it: the band drew at its
   authored width whatever its container was, which is the strip-down-the-middle
   the wider shell above was meant to end. Auto lets the aspect ratio set the
   height, so the whole drawing scales with the page — every mark on it in
   proportion, phone and desktop alike. */
.qw-band svg{display:block;width:100%;height:auto;touch-action:pan-y}
/* The hour labels that name the band's support columns. The columns stand on
   real clock hours now, so this row is the axis those columns already are; it
   is deliberately fainter and smaller than the captions below, which are the
   band's title rather than its scale.

   position:relative on the row and absolute spans inside it, because each label
   has to sit at its column's own fraction of the width and those fractions are
   whatever the clock says — the columns drift as the window slides, so no flex
   or grid arrangement can express them. The height is fixed rather than derived
   from the (absolutely positioned, and therefore zero-height) spans, so the
   captions below do not move up when a sparse day draws no labels at all. */
.qw-band-hours{position:relative;height:11px;margin-top:3px;font-size:8.5px;
               color:var(--faint);letter-spacing:.03em;font-variant-numeric:tabular-nums}
.qw-band-hours span{position:absolute;top:0;white-space:nowrap;line-height:11px}
.qw-band-axis{display:flex;justify-content:space-between;padding:4px 0 12px;font-size:9.5px;
              color:var(--faint);letter-spacing:.03em}

/* never-reported disclosure.

   Its table is aligned to the ride list's 1010 by the media query above, which
   is a deliberate exception to the 760 cap the front page's park list keeps.
   The cap exists to stop a name and a NUMBER drifting to opposite edges with a
   desert between them, and the reader having to travel it to pair them. Nothing
   here is paired: every row's right-hand cell is the same three words, so it
   reads as a repeated column label rather than as this row's value, and the
   travel the cap prevents is travel nobody makes.
   What is left if it keeps 760 is a hairline stopping 250 px short of the
   identical hairline directly above it — the list and its own continuation
   visibly different widths, which looks like a rendering fault. Both were
   looked at at 1440 with the disclosure open; this is the better of the two. */
/* The disclosure's own summary styling is gone: .qw-card-head styles it now,
   like every other card's header. Leaving both meant two chevrons -- one from
   summary::before here and one from the header's b::before -- and this rule's
   align-items:center quietly overriding the header's baseline alignment.
   .qw-card + .qw-card already supplies the margin this used to add. */

/* A CLOSED disclosure has nothing under its header, so the header's rule would
   sit one pixel above the card's own border as a doubled line. It draws only
   when there is something below it to divide from. */
details.qw-card:not([open]) > summary.qw-card-head{border-bottom:0}

/* The attraction page's headline, now inside a card like everything else on
   that page. The padding is the card's, not the page ground's -- it used to
   carry padding-top:14px to stand off the breadcrumb above it, which inside a
   card would have sat on top of the header's own rule. */
.qw-now{display:flex;align-items:flex-end;gap:11px;padding:13px 14px 15px}
.qw-now-big{font-family:var(--display);font-size:50px;font-weight:700;letter-spacing:-.055em;
            line-height:.82;color:var(--signal);font-variant-numeric:tabular-nums}
/* The unit and the status line that sit beside the big figure. The padding is
   what seats them on its baseline, which is why both carry their own. */
.qw-now-unit{font-size:11px;color:var(--faint);padding-bottom:4px}
.qw-now-note{font-size:11px;color:var(--muted);padding-bottom:5px}
/* .qw-chart is gone with uPlot: the attraction page draws the same Track band
   the park page does, so it uses .qw-band and needs no container rules of its
   own. See ADR 0005, superseded.

   The stats row no longer paints its own surface, border, radius or margin —
   it sits inside a real .qw-card now and was drawing a second box inside the
   first. Only the row layout is left here. */
.qw-stats{display:flex}
.qw-stats div{flex:1;padding:10px 0 10px 14px}
.qw-stats div + div{border-left:1px solid var(--hair)}
.qw-stats b{display:block;font-family:var(--display);font-size:17px;font-weight:700;
            letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.qw-stats i{display:block;font-style:normal;font-size:9px;color:var(--faint);margin-top:3px;
            letter-spacing:.06em;text-transform:uppercase}
/* The coverage sentence, which lives inside the Summary card under the three
   figures. The rule above it is the same hairline that divides the row of
   figures from anything else, so the sentence reads as a second row of the card
   rather than as a caption that escaped it. No margin-top: the padding is the
   card's own, and a margin here would push the sentence off its divider. */
.qw-note{font-size:11px;color:var(--muted);line-height:1.6;
         padding:10px 14px 12px;border-top:1px solid var(--hair)}
/* A note that IS a card's body, rather than a second row under one: the header
   above it already drew the dividing rule, and a second one a pixel below reads
   as a doubled line. */
.qw-card-head + .qw-note{border-top:0}

/* ── The weather rows' own styling is gone: they are .qw-fact rows in the park
   details card now, and a weather line is one park fact among several rather
   than a paragraph with its own type and spacing. `.weather-now` and
   `.weather-stale` survive as class hooks only — tests name them, and the
   staleness row still wants its italic, which lives with .qw-fact above.

   `.weather-icon` is gone with them: the icon is a .qw-fact-icon now, sized by
   the fixed slot that fixed the alignment rather than by a font-size of its
   own. ── */

/* framework leftovers that must keep working */
h1:focus{outline:none}
.validation-message{color:var(--signal)}
.blazor-error-boundary{background:var(--signal);padding:1rem;color:#fff}
.blazor-error-boundary::after{content:"An error has occurred."}

/* ── The Ko-fi support dialog ────────────────────────────────────────────────
   A native <dialog>, so the centring, the dimmed backdrop, the focus trap and
   Escape-to-close are the browser's rather than ours. The only thing worth
   styling is the box itself.

   No !important anywhere in here, which is the point of the shape: this is our
   own markup around somebody else's iframe, not our stylesheet arguing with
   somebody else's. The version this replaced needed six of them.

   max-height keeps a 712px panel inside a short window -- the close button is at
   the top, and a panel taller than the viewport would put it out of reach. */
/* margin:auto is what centres a modal <dialog>, and it is the UA's own rule --
   which this stylesheet's `* { margin: 0 }` reset silently beats, because author
   styles win over user-agent styles. Without this line the panel opens hard
   against the top-left corner with a correctly dimmed backdrop behind it, which
   looks like a positioning bug and is actually the reset. */
.qw-kofi{border:0;padding:0;margin:auto;background:transparent;overflow:visible;
         width:min(360px,calc(100vw - 32px));max-height:calc(100vh - 32px)}
.qw-kofi::backdrop{background:rgba(14,20,25,.45)}
.qw-kofi-frame{display:block;width:100%;height:712px;max-height:calc(100vh - 60px);
               border:0;border-radius:10px;background:var(--surface)}
/* Above the frame's own corner, and outside it: the iframe is a third party's
   page and cannot be asked to leave room for our chrome. */
.qw-kofi-close{position:absolute;top:-13px;right:-13px;width:28px;height:28px;
               border:1px solid var(--edge);border-radius:50%;background:var(--surface);
               color:var(--muted);font-size:16px;line-height:1;cursor:pointer;
               display:flex;align-items:center;justify-content:center;padding:0}
.qw-kofi-close:hover{color:var(--ink);border-color:var(--structure)}
.qw-kofi-close:focus-visible{outline:2px solid var(--signal);outline-offset:2px}
/* The header link that opens it. It is a nav link like "Crawler status" beside
   it -- the accent is not spent here, because this is a link to somewhere else
   rather than a control that changes what the page shows. */
/* A plain inline link, NOT inline-flex. An inline-flex box takes its baseline
   from its first flex item, and the first item here is an <img> -- which has no
   text baseline, so the box falls back to aligning by its bottom margin edge.
   The result was this link sitting a couple of pixels off the line "Crawler
   status" next to it shares, which is what "the top banner texts are not well
   aligned" was. Left inline, both links are ordinary inline boxes on one line
   and share its baseline by construction rather than by tuning. */
.qw-support{margin-left:18px}
/* Ko-fi's mark is a full-colour PNG and the only non-monochrome thing in this
   header, so it is held to the cap height of the text beside it rather than
   allowed to set the line's height. vertical-align nudges it off the baseline
   to sit optically centred on the capitals; the mark is a cup with a heart in
   it, so its own visual centre is lower than a glyph's. Sized in the markup too
   (width/height attributes), which is what stops the header reflowing as the
   image decodes. */
.qw-support-mark{display:inline-block;width:16px;height:13px;
                 vertical-align:-2px;margin-right:6px}