/* ==========================================================================
   WEB 1.0 — exhibition room. Loaded on a/web-1-0.html.

   TIER 2, with a twist: the register is reproduced at MARKUP level, so
   this sheet's job inside the canvas is mostly to get out of the way —
   revert the house styling back to browser defaults (Times, default link
   colours, default heading scale) and let the table attributes do the
   layout, the way the era did. The matte outside the canvas is the
   museum's and stays quiet.

   The star and the stripe are our CSS reproduction of looping-GIF
   grammar: steps() only, continuous, never eased, never triggered.
   ========================================================================== */

.w1-page { background: var(--paper); }
.w1-page main { background: var(--paper); }
.w1-wrap { padding: clamp(1.5rem, 4vw, 3rem) 1rem clamp(2.5rem, 5vw, 4rem); }

.w1-matte-note {
  max-width: 40rem;
  margin: 0 auto 1.5rem;
  font: 400 0.78rem/1.65 var(--mono);
  color: var(--ink-3);
  text-align: center;
}

/* the canvas: fixed 640, never responsive — the constraint is the point.
   On narrow screens the MATTE scrolls; the composition does not reflow. */
.w1 { overflow-x: auto; }
.w1-frame {
  width: 640px;
  max-width: 100%;   /* the period's fixed canvas, but never a sideways scroll on a phone */
  box-sizing: border-box;
  overflow-x: auto;  /* the fixed-width table scrolls inside the canvas, as a 1990s page would */
  margin-inline: auto;
  padding: 8px;
  /* tiled ground: our stand-in for a tiled background image — a coarse
     grey weave at GIF-era fidelity, hard-edged, no gradient smoothness */
  background:
    repeating-linear-gradient(0deg, #B8B8B8 0 1px, transparent 1px 8px),
    repeating-linear-gradient(90deg, #B4B4B4 0 1px, #CFCFCF 1px 8px);
  border: 2px inset #999999;
}

/* revert the house voice to the era's defaults inside the canvas */
.w1-frame, .w1-frame td, .w1-frame th, .w1-frame p, .w1-frame li, .w1-frame small, .w1-frame h1, .w1-frame h2 {
  font-family: "Times New Roman", Times, serif;
  color: #000000;
  letter-spacing: normal;
}
.w1-frame h1 { font-size: 2em; margin: 0.3em 0; font-weight: 700; }
.w1-frame h2 { font-size: 1.5em; margin: 0.6em 0 0.4em; font-weight: 700; }
.w1-frame p { font-size: 1rem; line-height: 1.4; margin: 0.6em 0; }
.w1-frame small { font-size: 0.8em; }
.w1-frame tt { font-family: "Courier New", monospace; }
.w1-frame hr { border: 0; border-top: 1px solid #808080; border-bottom: 1px solid #FFFFFF; margin: 0.8em 0; }
.w1-frame ul { margin: 0.5em 0 0.5em 1.4em; padding: 0; }

/* THE POINT: link colours revert to the user agent's own defaults.
   Blue unvisited, purple visited — and nothing here says another word. */
.w1-frame a { color: revert; text-decoration: revert; }
.w1-frame a:visited { color: revert; }

.w1-t { background: #FFFFFF; border: 1px solid #808080; }

/* the blinking NEW star — GIF-loop grammar: steps, continuous, no easing */
.w1-star { color: #B00000; font-weight: 700; }
@media (prefers-reduced-motion: no-preference) {
  .w1-star { animation: w1-blink 1.2s steps(2, jump-none) infinite; }
  @keyframes w1-blink { 0% { opacity: 1; } 100% { opacity: 0.15; } }
}

/* the construction stripe — a crawling hazard band, steps only */
.w1-stripe {
  height: 14px;
  margin: 0.4em 0;
  background: repeating-linear-gradient(45deg, #E8C400 0 12px, #1A1A1A 12px 24px);
}
@media (prefers-reduced-motion: no-preference) {
  .w1-stripe { animation: w1-crawl 1.6s steps(8) infinite; }
  @keyframes w1-crawl { from { background-position: 0 0; } to { background-position: 33.94px 0; } }
}

/* the furniture (Design Completion Campaign, 2026-09-29): the documented
   rendering conventions. The bas-relief is restated here because the house sheet flattens tables; the
   grooved rule is the default, the flat one asked for with NOSHADE. The
   88x31 slots are the room's placeholder: no licensed period GIF is held. */
.w1-frame table[border="4"] { border: 4px outset #C0C0C0; border-spacing: 4px; background: #C0C0C0; }
.w1-frame table[border="4"] td { border: 1px inset #C0C0C0; background: #FFFFFF; font-size: 0.9rem; }
.w1-frame hr.w1-flat { border: 0; height: 2px; background: #808080; }
.w1-88 { display: flex; flex-wrap: wrap; gap: 6px; }
.w1-88 span { display: inline-flex; align-items: center; justify-content: center; width: 88px; height: 31px; box-sizing: border-box; border: 1px dashed #808080; font: 400 11px/1 "Courier New", monospace; color: #555555; }