/* The minimum-wage page's stories (includes/stories/anul-rupt.php): 2026 as a roll of continuous
   payroll paper torn at 1 July, and the walk over the net from the minimum wage. The theme's tokens
   only, so dark mode follows by itself; the server's drawing is the final state, the states below
   apply only while the story is live (csn-story.js). */

/* ---- 1. The roll ---- */
.anr .anr-paper { fill: var(--card); stroke: var(--line-2); stroke-width: 1; stroke-linejoin: round; }
.anr .anr-perf { stroke: var(--line-2); stroke-width: 1; stroke-dasharray: 2 3; }
.anr .anr-sprocket { fill: var(--paper-2); stroke: var(--line-2); stroke-width: 1; }
.anr .anr-mon { font-weight: 700; font-size: 11.5px; letter-spacing: .09em; fill: var(--ink-2); }
.anr .anr-hole { fill: var(--acc); transition: fill .5s ease, stroke .5s ease; }
.anr .anr-count { font: 500 12.5px var(--mono); fill: var(--ink-3); }
.anr .anr-kick { font-weight: 650; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; fill: var(--ink-3); }
.anr .anr-big { font-size: 40px; }
.anr .anr-big--new { fill: var(--acc); }
.anr .anr-act { font-weight: 600; font-size: 13.5px; fill: var(--ink-2); }
.anr .anr-hr { font-weight: 550; font-size: 15px; fill: var(--ink); }
.anr .anr-slip { font: 500 16px var(--mono); fill: var(--ink); }
.anr .anr-slip__k { font: 600 13px var(--sans); fill: var(--ink-3); letter-spacing: .02em; }
.anr .anr-datet { font-weight: 700; font-size: 12.5px; letter-spacing: .04em; fill: var(--ink); }
.anr .pencil.hl.anr-hl { stroke-width: 15; }
.anr.st--s .anr-mon { font-size: 12px; letter-spacing: 0; }
.anr.st--s .anr-count { font-size: 11.5px; }
.anr.st--s .anr-kick { font-size: 11.5px; letter-spacing: .06em; }
.anr.st--s .anr-big { font-size: 27px; }
.anr.st--s .anr-act { font-size: 12.5px; }
.anr.st--s .anr-hr { font-size: 13.5px; }
.anr.st--s .anr-hr--2 { fill: var(--ink-2); font-weight: 500; }
.anr.st--s .anr-slip { font-size: 13.5px; }
.anr.st--s .anr-slip__k { font-size: 12px; }
.anr.st--s .anr-datet { font-size: 12px; }
.anr.st--s .pencil.hl.anr-hl { stroke-width: 13; }

/* The tear: the right half lies a little apart and a little askew; while the roll comes into view
   it starts joined and comes apart once (data-reveal="tear"; at once when motion is reduced). */
.anr .anr-half--r { transform-box: fill-box; transform-origin: 0 100%; transform: rotate(.6deg); }
.story--anul.reveal-ready .anr-half--r { transform: translateX(-9px); }
.story--anul.reveal-ready.is-revealed .anr-half--r { transform: rotate(.6deg); transition: transform 1.1s cubic-bezier(.3, .7, .2, 1) .35s; }

/* States 0 and 1: the holes are still only paper; at state 2 they are counted. */
.scrolly.is-live .story--anul[data-state="0"] .anr-hole,
.scrolly.is-live .story--anul[data-state="1"] .anr-hole { fill: var(--paper-2); stroke: var(--line-2); stroke-width: .8; }

/* ---- 2. The walk ---- */
.pot .pot-ground { fill: var(--paper-2); }
.pot .pot-hatch { stroke: var(--ink-3); stroke-width: 1; stroke-opacity: .55; }
.pot .pot-band { fill: none; stroke-width: 26; stroke-linejoin: round; }
.pot .pot-ledge { fill: var(--acc-pale); }
.pot .pot-edge { fill: none; stroke: var(--ink-3); stroke-width: 1.2; stroke-linejoin: round; }
.pot .pot-scarp { stroke: var(--acc-deep); stroke-width: 1.4; stroke-linecap: round; }
.pot .pot-tick { stroke: var(--ink-3); stroke-width: 1; }
.pot .pencil.pot-walk { stroke-width: 3.4; stroke-linecap: round; stroke-linejoin: round; }
.pot .pencil.pot-walk--ledge { stroke: var(--acc); }
.pot .pencil.pot-walk--base { stroke: var(--ink); stroke-width: 3; }
.pot .pencil.pot-level { stroke: var(--ink-2); stroke-dasharray: none; }
.pot .pot-key line { stroke-width: 3.4; stroke-linecap: round; }
.pot .pot-key__ledge { stroke: var(--acc); }
.pot .pot-key__ground { stroke: var(--ink); }
.pot .pot-k { font-weight: 550; font-size: 13px; fill: var(--ink-2); }
.pot .pot-k--ink { fill: var(--ink); font-weight: 600; }
.pot .pot-post circle { fill: var(--paper); stroke: var(--ink); stroke-width: 2; }
.pot .pot-post--start circle { fill: var(--acc); stroke: var(--paper); stroke-width: 2.5; }
.pot .pot-v { font-weight: 700; font-size: 14px; fill: var(--ink); font-variant-numeric: tabular-nums; }
.pot .pot-v--ledge { fill: var(--acc-deep); }
.pot .pot-label text { paint-order: stroke; stroke: var(--paper); stroke-width: 5px; stroke-linejoin: round; }
.pot--old .pot-label text { stroke: var(--paper); }
.pot.st--s .pot-v { font-size: 12.5px; }
.pot.st--s .pot-k { font-size: 12px; }
.pot.st--s .pencil.pot-walk { stroke-width: 2.8; }
.pot.st--s .pencil.pot-walk--base { stroke-width: 2.5; }
.pot.st--s .pot-band { stroke-width: 20; }
.pot .st-note.pot-note--hole { font-size: 21px; }
.pot.st--s .st-note.pot-note--hole { font-size: 15.5px; }
.pot .pot-k--ledge { fill: var(--acc-deep); }
