/* ui/demowatermark.css — owned by W16.  B-66 / B-67.
 *
 * THE FINDING
 *   "The INDEX claims demo is stamped, striped, bannered and watermarked so nobody can mistake
 *    it. THERE IS NO WATERMARK STRING IN THE DOM."
 *
 *   The only demo marker on screen 08 was a chip near the top. It scrolls out of view within
 *   ONE THUMB-SWIPE, leaving ~4,200px of scroll containing every synthetic number with no
 *   marker on any of it. Screenshot the middle of that page and you have an image of a real,
 *   named, 107-bed aged-care home's daily care-minute record that is entirely fabricated, with
 *   nothing on it saying so.
 *
 *   Our CIO reviewer called this a LEGAL problem rather than a design one, and he is right: in
 *   a discovery bundle two years from now, that screenshot is indistinguishable from a record.
 *
 * THE RULE
 *   The mark must survive SCROLL, SCREENSHOT and EXPORT. So:
 *     - it is FIXED to the viewport, not to the top of the document;
 *     - it is a real DOM element with real text, so it is in the accessibility tree, in a text
 *       extraction, and in any capture harness that reads the DOM rather than the pixels;
 *     - it is a diagonal repeating tile across the content, so any crop of any region of any
 *       screenshot contains it;
 *     - it is pointer-events:none, so it can never block a click during a live demo.
 *
 * Every selector is prefixed dw- and the body flag is data-demo, so nothing here can restyle
 * another worker's surface.
 */

/* W60 — RECOLOURED TO THE LOOP IQ PALETTE, ON ANDREW'S RULING.
 *
 *   "I like the 'green' outline when in demo mode. But maybe you can use bright Loop colours."
 *
 * This file shipped in crimson #A3243C — which is not even a colour of its own: it is a
 * hardcoded copy of --neg-ink. Two problems in one literal. It said "error" rather than
 * "demonstration", and it was a token's value typed out by hand, so it could not follow the
 * token when W53 landed the brand.
 *
 * WHITE TEXT DOES NOT SURVIVE THE SWAP. Every bright Loop token is a light tint, and the
 * obvious move — keep the white text, change the fill — measures:
 *
 *     #FFF on --tropical-indigo  2.20:1      #FFF on --jordy-blue  2.01:1
 *     #FFF on --mauve            1.55:1      #FFF on --thistle     1.40:1
 *
 * all of which are illegible, on the one element in the product whose entire job is to be
 * read. Inverting it holds the line exactly:
 *
 *     --russian-violet on --tropical-indigo = 7.29:1   (AA at any size)
 *     the crimson bar this replaces         = 7.30:1
 *
 * Same legibility to within 0.01, in the brand. Measured, not eyeballed.
 *
 * THE OUTLINE ANDREW MEANS IS NOT IN THIS FILE. It is styles.css:1654,
 * `body.presenting .app{box-shadow:inset 0 0 0 2px var(--lime)}` — one of the seventeen live
 * ratchet sites gate_brand tracks, and W53's to retire per-site with contrast. Not touched
 * here: two workers recolouring one ring in one afternoon is a merge conflict with a
 * customer-visible outcome. Reported instead.
 *
 * TOKENS, NOT HEXES — the whole point of W53's slice. The wash needs an alpha, and a token
 * cannot be poured into rgba(), so color-mix() keeps the token and takes the alpha from it.
 */

/* W71 — THE DIAGONAL WASH IS REMOVED, ON ANDREW'S RULING.
 *
 *   "I really don't like this watermark diagonal lines in the demo environment. Way too
 *    stimulating. Can you get rid of it."
 *
 * What was here: a fixed, full-viewport `repeating-linear-gradient(-45deg, ...)` at 7% alpha
 * of --russian-violet, z-index 40. It was NOT an orphan and it was NOT the "watermark string"
 * the old audit went looking for — a previous worker searched for a *string*, found none, and
 * filed the watermark as absent from the DOM. `#dw-wash` was in the DOM the whole time, on
 * every pixel. #14: absence of a match is evidence about your regex.
 *
 * WHAT THIS COSTS, STATED PLAINLY SO THE NEXT AUDIT DOESN'T HAVE TO REDISCOVER IT:
 * the wash was the only NON-EDGE mark. Its stated job was "any crop of any region of any
 * screenshot contains it." .dw-stamp (top-right), .dw-bar (bottom) and the presenting ring
 * (styles.css, inset box-shadow on .app) are all edge marks: a full-window capture is still
 * marked on three sides, but a tight crop of the middle of a 4,200px care-minutes page is now
 * innocent of the mark. That is the exact artefact B-66 was raised about. Andrew has been told
 * this in writing and asked for it anyway; it is his call to make, but it is a trade, not a
 * cleanup. If it returns, it returns as a corner tile, not a full-surface repeat — the
 * objection on record is the stimulation, not the disclosure.
 *
 * The sentence stays. A stripe is a decoration; a sentence is a disclosure.
 */

/* The words. A stripe is a decoration; a sentence is a disclosure. */
body[data-demo="1"] .dw-bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 41;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 7px 14px;
  background: var(--tropical-indigo);
  color: var(--russian-violet);
  border-top: 2px solid var(--russian-violet);
  font: 700 11px/1.35 var(--font-head, system-ui, sans-serif);
  letter-spacing: 0.04em;
  text-align: center;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.18);
}

body[data-demo="1"] .dw-bar b { font-weight: 800; text-transform: uppercase; }
body[data-demo="1"] .dw-bar span { font-weight: 500; opacity: 0.95; }

/* Keep the fixed bar from covering the last row of content. */
body[data-demo="1"] { padding-bottom: 42px; }

/* A corner stamp that lands in a cropped screenshot of the TOP of the page too. */
body[data-demo="1"] .dw-stamp {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 41;
  pointer-events: none;
  padding: 4px 10px;
  background: var(--tropical-indigo);
  color: var(--russian-violet);
  font: 800 9.5px/1.3 var(--font-head, system-ui, sans-serif);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 0 0 0 6px;
}

/* PRINT / PDF. The mark must survive Ctrl-P as well as a screenshot — a printed page of
   fabricated care minutes with no watermark is the same artefact as a screenshot of one. */
@media print {
  body[data-demo="1"] .dw-bar,
  body[data-demo="1"] .dw-stamp {
    position: fixed;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* 390px. The bar wraps rather than truncating: a watermark that ellipsises to
   "DEMONSTRATION DATA — generated from pub…" has lost the clause that does the work. */
@media (max-width: 480px) {
  body[data-demo="1"] .dw-bar {
    font-size: 10px;
    padding: 6px 10px;
    flex-direction: column;
    gap: 2px;
    line-height: 1.3;
  }
  body[data-demo="1"] { padding-bottom: 56px; }
}

/* Andrew: the bottom demo disclaimer stripe is not required - the diagonal wash (#dw-wash)
   and the top-right stamp keep every screenshot marked as a demo. Remove the bottom bar. */
body[data-demo="1"] .dw-bar { display: none !important; }
body[data-demo="1"] { padding-bottom: 0 !important; }