/* elizabeth.world — design system (Task P2.2)
 *
 * The single source of truth for the DOM side of the UI: palette, spacing,
 * radius, shadow, and the four font stacks, plus the component classes every
 * overlay/table/toast/button consumes (.ew-panel, .ew-btn, .ew-input,
 * .ew-table, .ew-toast, .ew-heading). Imported once in main.ts. NO component
 * file defines its own colours/fonts again — grep-gate enforced (exactly
 * ONE family app-wide: Baloo 2).
 *
 * Palette: warm parchment / wood / gold / deep-green (Liz-approved sample).
 * Fonts:   Baloo 2 everywhere — a smooth variable font (wght 400–800). The
 *          four-voice token structure (display/body/accent/prose) is kept so
 *          consumers stay untouched, but every voice resolves to Baloo 2;
 *          voices now differ by size/weight/casing at the call site, not by
 *          family.
 *
 * @font-face lives in index.html (shared with the Phaser canvas; about.html
 * is a separate static page with its own copy of the same single face).
 */

:root {
  /* --- palette (tuned hexes from the approved sample) --- */
  --ew-parchment: #f4e4c1;
  --ew-parchment-dark: #ead2a0;
  --ew-parchment-light: #fffaf0;
  --ew-wood: #6b4a2f;
  --ew-wood-dark: #4a3220;
  --ew-ink: #3a2a1a;
  --ew-ink-soft: #5a4630;
  --ew-gold: #c9962b;
  --ew-gold-light: #e6b84f;
  --ew-green: #33513f;
  --ew-green-dark: #22392b;
  --ew-green-light: #4a6d58;
  --ew-cream: #cfe3d6; /* muted text on the dark-green HUD/plates */
  --ew-danger: #b5462e;
  --ew-danger-light: #d4674b;

  /* top-3 leaderboard rank accents */
  --ew-rank-gold: #e6b84f;
  --ew-rank-silver: #c9c9cf;
  --ew-rank-bronze: #c9884f;

  /* --- fonts --- */
  /* Pixel fonts removed 2026-07-10: they rendered uneven thick/thin strokes at
     any fractional size/weight/zoom — an unfixable class of bug. One smooth
     variable font (Baloo 2, wght 400–800) now; any size/weight is safe.
     All four voice vars resolve to the same family (kept as separate tokens so
     consumers stay untouched and voices can be retargeted later). */
  --ew-font-display: 'Baloo 2', system-ui, sans-serif;
  --ew-font-body: 'Baloo 2', system-ui, sans-serif;
  --ew-font-accent: 'Baloo 2', system-ui, sans-serif;
  --ew-font-prose: 'Baloo 2', system-ui, sans-serif;

  /* --- spacing scale --- */
  --ew-sp-1: 4px;
  --ew-sp-2: 8px;
  --ew-sp-3: 12px;
  --ew-sp-4: 16px;
  --ew-sp-5: 24px;
  --ew-sp-6: 32px;

  /* --- radius / shadow --- */
  --ew-radius: 8px;
  --ew-radius-sm: 5px;
  --ew-shadow: 0 6px 16px rgba(40, 25, 10, 0.32);
  --ew-shadow-sm: 0 2px 6px rgba(40, 25, 10, 0.22);
}

/* 98.css (bundled app-wide for the desktop) ships a global `body{font-family:
 * Arial}` that leaks Arial as the document default outside the desktop. Pin the
 * app's DOM default to our body voice with a higher-specificity guard so no
 * stray/unclassed element can ever fall back to Arial. (P2.8 sweep.) */
html body {
  font-family: var(--ew-font-body);
}

/* 98.css chrome → Baloo 2. 98.css sets its own bundled pixel face +
 * `-webkit-font-smoothing: none` on title bars,
 * windows, buttons, inputs, labels, legends, tabs, selects, tables, textareas
 * and tree views. Since the pixel-font removal (2026-07-10) the Win98 chrome
 * renders Baloo 2 too — no exception. 98.css is imported in desktop.ts and
 * lands AFTER this file in the bundle, so equal specificity would lose; the
 * `:root` prefix bumps each selector above 98.css's bare-element rules without
 * needing !important. Keep 98.css's tiny sizes (11px etc.) — Baloo 2 is legible
 * there. Font smoothing is restored for the smooth vector face. */
:root .title-bar,
:root .window,
:root button,
:root input,
:root label,
:root legend,
:root li[role='tab'],
:root option,
:root select,
:root table,
:root textarea,
:root ul.tree-view {
  font-family: var(--ew-font-body);
  -webkit-font-smoothing: auto;
}

/* ---------------------------------------------------------------------------
 * Backdrop — dims the world behind a modal panel and centres it.
 * ------------------------------------------------------------------------- */
.ew-backdrop {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  background: rgba(28, 18, 8, 0.6);
  padding: clamp(12px, 3vw, 28px);
  box-sizing: border-box;
  pointer-events: auto;
  font-family: var(--ew-font-body);
}

/* ---------------------------------------------------------------------------
 * Panel — the warm parchment/wood RPG-dialog box.
 * ------------------------------------------------------------------------- */
.ew-panel {
  box-sizing: border-box;
  background-color: var(--ew-parchment);
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.35), rgba(255, 255, 255, 0) 30%),
    repeating-linear-gradient(45deg, rgba(107, 74, 47, 0.03) 0, rgba(107, 74, 47, 0.03) 2px, transparent 2px, transparent 8px);
  color: var(--ew-ink);
  border: 4px solid var(--ew-wood);
  border-radius: var(--ew-radius);
  box-shadow:
    inset 0 0 0 2px var(--ew-parchment-dark),
    var(--ew-shadow);
  padding: clamp(20px, 2.8vw, 30px) clamp(22px, 3.2vw, 36px);
  width: min(720px, 94vw);
  max-height: 88vh;
  overflow: auto;
  font-family: var(--ew-font-body);
  font-size: clamp(15px, 1.4vw, 16px);
  line-height: 1.65;
}

/* Headings — the display voice. .ew-heading is the standalone utility;
 * h1/h2/h3 inside a panel pick up the same treatment. */
.ew-heading,
.ew-panel h1,
.ew-panel h2,
.ew-panel h3 {
  font-family: var(--ew-font-display);
  font-weight: 400;
  color: var(--ew-green-dark);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
  letter-spacing: 0.01em;
  margin: 0 0 var(--ew-sp-3);
  line-height: 1.2;
}
.ew-panel h2 { font-size: 32px; }
.ew-panel h3 { font-size: 24px; color: var(--ew-wood-dark); margin-top: var(--ew-sp-5); }

.ew-sub { color: var(--ew-ink-soft); margin: 0 0 var(--ew-sp-4); font-size: clamp(14px, 1.4vw, 15px); }
.ew-body { font-size: clamp(15px, 1.4vw, 16px); line-height: 1.7; margin: 0 0 var(--ew-sp-4); }
.ew-tag { font-size: clamp(12px, 1.2vw, 13px); color: var(--ew-ink-soft); margin: var(--ew-sp-3) 0 0; }

/* PROSE voice — comfortable long-form reading: the credits intro paragraph
 * today, about.html's body copy, the Win98 desktop windows (P2.7). Roomier
 * line-height and a touch larger than .ew-body. Never applied to digits/tables
 * — see .ew-num, which stays pinned to the body voice with lining figures. */
.ew-prose {
  font-family: var(--ew-font-prose);
  font-size: clamp(16px, 1.5vw, 17px);
  line-height: 1.7;
  margin: 0 0 var(--ew-sp-4);
}

/* ---------------------------------------------------------------------------
 * Form fields / inputs.
 * ------------------------------------------------------------------------- */
.ew-field { display: block; margin: 0 0 var(--ew-sp-4); }
.ew-field > span {
  display: block;
  font-size: clamp(12px, 1.2vw, 13px);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ew-wood-dark);
  margin-bottom: var(--ew-sp-2);
}
.ew-input,
.ew-panel input {
  font-family: var(--ew-font-body);
  font-size: clamp(16px, 1.6vw, 18px);
  width: 100%;
  box-sizing: border-box;
  background: var(--ew-parchment-light);
  color: var(--ew-ink);
  border: 2px solid var(--ew-wood);
  border-radius: var(--ew-radius-sm);
  padding: clamp(10px, 1.2vw, 13px) 12px;
}
.ew-input:focus,
.ew-panel input:focus {
  outline: none;
  border-color: var(--ew-gold);
  box-shadow: 0 0 0 3px rgba(201, 150, 43, 0.28);
}

.ew-msg { min-height: 18px; margin: 0 0 var(--ew-sp-3); font-size: clamp(12px, 1.2vw, 13px); color: var(--ew-danger); line-height: 1.5; }

/* ---------------------------------------------------------------------------
 * Buttons.
 * ------------------------------------------------------------------------- */
.ew-actions { display: flex; gap: var(--ew-sp-3); justify-content: flex-end; margin-top: var(--ew-sp-2); flex-wrap: wrap; }
.ew-btn {
  /* Buttons are action labels → display voice (P2.8 unification: matches the
     login's .ew-signbtn). */
  font-family: var(--ew-font-display);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.01em;
  background: linear-gradient(180deg, var(--ew-green-light), var(--ew-green));
  color: var(--ew-parchment);
  border: 2px solid var(--ew-green-dark);
  border-radius: var(--ew-radius-sm);
  padding: clamp(10px, 1.2vw, 13px) clamp(16px, 1.8vw, 22px);
  cursor: pointer;
  box-shadow: var(--ew-shadow-sm);
}
.ew-btn:hover { filter: brightness(1.08); }
.ew-btn:active { transform: translateY(1px); box-shadow: none; }
.ew-btn[disabled] { opacity: 0.5; cursor: default; filter: none; }

/* Primary call-to-action — gold. */
.ew-btn-primary,
.ew-btn.ew-btn-primary {
  background: linear-gradient(180deg, var(--ew-gold-light), var(--ew-gold));
  color: var(--ew-ink);
  border-color: var(--ew-wood-dark);
}

/* Ghost / secondary — quiet outline on parchment. */
.ew-btn.ghost {
  background: transparent;
  color: var(--ew-wood-dark);
  border: 2px solid var(--ew-wood);
  box-shadow: none;
}
.ew-btn.ghost:hover { background: rgba(107, 74, 47, 0.08); filter: none; }

.ew-shake { animation: ew-shake 0.4s ease; }
@keyframes ew-shake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-7px); }
  40% { transform: translateX(7px); }
  60% { transform: translateX(-5px); }
  80% { transform: translateX(5px); }
}

/* ---------------------------------------------------------------------------
 * Cozy login / naming dialog (Task P2.2b).
 *
 * A narrower, warmer variant of .ew-panel used only by the login/registration
 * flow. Composition studied from cozy-game name-entry screens (Stardew Valley
 * character creator; itch.io cozy-farming UI kits): a friendly speaker portrait,
 * a big welcoming prompt, one roomy soft-inset input (or discrete PIN boxes), a
 * carved wooden primary button, and a quiet text back/esc action — never a
 * competing second button. Voices here: the display voice (the .ew-prompt
 * heading), the body voice (everything else), and the .ew-flavor accent line —
 * all Baloo 2. The old uppercase tracked field labels — the former "third
 * voice" — are gone.
 * ------------------------------------------------------------------------- */
.ew-panel.ew-dialog {
  width: min(430px, 94vw);
  text-align: center;
  border-radius: 16px;
  padding: clamp(22px, 3vw, 30px) clamp(24px, 3.4vw, 36px) clamp(20px, 2.6vw, 26px);
  border-width: 5px;
  box-shadow:
    inset 0 0 0 2px var(--ew-parchment-dark),
    inset 0 2px 0 rgba(255, 255, 255, 0.5),
    0 10px 30px rgba(40, 25, 10, 0.4);
}

/* Speaker portrait — a little composited LPC adventurer standing in the dialog,
 * built layer-by-layer in loginFlow.ts (background-position onto the shared LPC
 * walk-down idle frame). Sits on a soft grassy disc so it reads as "on a sign".*/
.ew-chara {
  position: relative;
  margin: 2px auto var(--ew-sp-2);
}
.ew-chara::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 4px;
  width: 62%;
  height: 12px;
  transform: translateX(-50%);
  background: radial-gradient(ellipse at center, rgba(51, 81, 63, 0.28), rgba(51, 81, 63, 0) 70%);
  border-radius: 50%;
}
.ew-chara-layer {
  position: absolute;
  left: 0;
  top: 0;
  background-repeat: no-repeat;
  image-rendering: pixelated;
}

/* Big welcoming prompt (display voice) — the panel's h2 already picks up the
 * display font; .ew-prompt just tunes size/spacing for the dialog. */
.ew-panel.ew-dialog h2.ew-prompt {
  font-size: clamp(26px, 3vw, 32px);
  color: var(--ew-green-dark);
  margin: 0 0 var(--ew-sp-1);
}

/* Flavor line — the accent voice (Task P2.2c). Kept behind this one
 * class/token so the whole flavor voice retargets from one place. */
.ew-flavor {
  font-family: var(--ew-font-accent);
  font-size: clamp(16px, 1.9vw, 20px);
  font-weight: 400;
  color: var(--ew-ink-soft);
  line-height: 1.5;
  letter-spacing: 0.01em;
  margin: 0 0 var(--ew-sp-4);
}

/* Roomy rounded input with a soft inset — never a naked square field. */
/* Form elements do NOT inherit fonts by default — force every form control
   inside a themed panel onto the panel's font so strays are impossible.
   (Scoped to .ew-panel so the Win98 desktop keeps its own look.) */
.ew-panel input, .ew-panel button, .ew-panel select, .ew-panel textarea {
  font-family: inherit;
}

.ew-panel.ew-dialog input.ew-name {
  text-align: center;
  font-family: var(--ew-font-display); /* typed name renders in the display voice */
  font-size: clamp(18px, 2vw, 21px);
  border-radius: 999px;
  border: 2px solid var(--ew-wood);
  padding: clamp(12px, 1.4vw, 15px) 20px;
  background:
    linear-gradient(180deg, rgba(58, 42, 26, 0.08), rgba(255, 255, 255, 0.35) 42%),
    var(--ew-parchment-light);
  box-shadow: inset 0 2px 5px rgba(58, 42, 26, 0.22);
}
.ew-panel.ew-dialog input.ew-name::placeholder { color: rgba(90, 70, 48, 0.5); }
.ew-panel.ew-dialog input.ew-name:focus {
  border-color: var(--ew-gold);
  box-shadow:
    inset 0 2px 5px rgba(58, 42, 26, 0.18),
    0 0 0 4px rgba(201, 150, 43, 0.3);
}

/* Discrete PIN digit boxes — auto-advance, backspace-friendly (loginFlow.ts).
 * This is the big perceived-quality upgrade over a single password field. */
.ew-cap {
  font-family: var(--ew-font-accent); /* accent chrome voice */
  font-size: clamp(15px, 1.5vw, 16px);
  color: var(--ew-ink-soft);
  margin: 0 0 var(--ew-sp-2);
}
.ew-cap.ew-cap-2 { margin-top: var(--ew-sp-3); }
.ew-pin {
  display: flex;
  gap: clamp(8px, 1.4vw, 12px);
  justify-content: center;
  margin: 0 0 var(--ew-sp-3);
}
/* Specificity note: 98.css (loaded for the desktop) styles bare
 * input[type=text] / button with its Windows-98 bevel; these selectors are
 * scoped under .ew-panel.ew-dialog so they reliably win over it. */
.ew-panel.ew-dialog input.ew-pin-box {
  width: clamp(46px, 6vw, 56px);
  height: clamp(54px, 7vw, 64px);
  padding: 0;
  text-align: center;
  font-family: var(--ew-font-body);
  font-size: clamp(24px, 3vw, 30px);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--ew-ink);
  background:
    linear-gradient(180deg, rgba(58, 42, 26, 0.1), rgba(255, 255, 255, 0.45) 46%),
    var(--ew-parchment-light);
  border: 2px solid var(--ew-wood);
  border-radius: 12px;
  box-shadow: inset 0 2px 5px rgba(58, 42, 26, 0.24);
  caret-color: var(--ew-gold);
}
.ew-panel.ew-dialog input.ew-pin-box:focus {
  outline: none;
  border-color: var(--ew-gold);
  box-shadow:
    inset 0 2px 5px rgba(58, 42, 26, 0.16),
    0 0 0 4px rgba(201, 150, 43, 0.32);
}
.ew-panel.ew-dialog input.ew-pin-box.ew-filled { border-color: var(--ew-gold); }

/* Carved wooden sign — the primary call to action. */
.ew-signbtn {
  font-family: var(--ew-font-display); /* prominent interactive label */
  font-size: clamp(18px, 1.9vw, 20px);
  font-weight: 700;
  letter-spacing: 0.02em;
  width: 100%;
  color: var(--ew-parchment-light);
  background: linear-gradient(180deg, #7d5636, var(--ew-wood) 55%, var(--ew-wood-dark));
  border: none;
  border-radius: 12px;
  padding: clamp(13px, 1.5vw, 16px) 20px;
  margin: var(--ew-sp-2) 0 0;
  cursor: pointer;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35);
  box-shadow:
    inset 0 1px 0 rgba(255, 235, 200, 0.35),
    inset 0 -3px 0 rgba(0, 0, 0, 0.28),
    inset 0 0 0 2px rgba(201, 150, 43, 0.55),
    0 4px 10px rgba(40, 25, 10, 0.35);
}
.ew-signbtn:hover { filter: brightness(1.07); }
.ew-signbtn:active {
  transform: translateY(2px);
  box-shadow:
    inset 0 1px 0 rgba(255, 235, 200, 0.25),
    inset 0 0 0 2px rgba(201, 150, 43, 0.5),
    0 2px 5px rgba(40, 25, 10, 0.3);
}
.ew-signbtn[disabled] { opacity: 0.55; cursor: default; filter: none; }

/* Quiet secondary action — a text link, not a button. Back / esc hint. Scoped +
 * !important on the box props so 98.css's button bevel never leaks through. */
.ew-hint { margin: var(--ew-sp-4) 0 0; min-height: 1em; }
.ew-panel.ew-dialog button.ew-quiet {
  font-family: var(--ew-font-accent); /* accent chrome voice */
  font-size: clamp(15px, 1.5vw, 16px);
  color: var(--ew-ink-soft);
  background: none;
  border: none;
  box-shadow: none;
  border-radius: 0;
  min-width: 0;
  padding: 4px 6px;
  cursor: pointer;
  text-decoration: none;
}
.ew-panel.ew-dialog button.ew-quiet:hover { color: var(--ew-wood-dark); text-decoration: underline; }
.ew-panel.ew-dialog button.ew-quiet:active { box-shadow: none; }
.ew-panel.ew-dialog button.ew-quiet[disabled] { opacity: 0.5; cursor: default; text-decoration: none; }

/* Dialog message line — centered, warm; reuses .ew-msg colour but recentres. */
.ew-panel.ew-dialog .ew-msg { text-align: center; margin: 2px 0 0; }

/* ---------------------------------------------------------------------------
 * Tables — leaderboard etc. Own-row highlight + top-3 rank accents.
 * Explicit backgrounds on th/td because 98.css (loaded for the desktop) styles
 * bare table cells with its own white Windows-98 chrome that would otherwise
 * leak through border-collapsed cells.
 * ------------------------------------------------------------------------- */
.ew-table-wrap { overflow-x: auto; margin: 0 0 var(--ew-sp-4); }
.ew-table {
  width: 100%;
  border-collapse: collapse;
  /* DISPLAY voice — same as the buttons (Liz's call: match "close [esc]"). */
  font-family: var(--ew-font-display);
  font-size: 16px;
  line-height: 1.5;
  color: var(--ew-ink);
  /* 98.css (loaded for the desktop) sets a bare `table { background:#fff }`;
     override it so our transparent cells show the parchment panel, not white. */
  background: transparent;
  white-space: normal;
}
.ew-table th {
  text-align: left;
  font-size: 16px; /* header row reads via bg + caps, not size/weight */
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 400;
  color: var(--ew-wood-dark);
  background: var(--ew-parchment-dark);
  border-bottom: 2px solid var(--ew-wood);
  padding: 6px 10px;
}
.ew-table td {
  padding: 8px 10px;
  border-bottom: 1px solid rgba(107, 74, 47, 0.22);
  background: transparent;
}
/* digits (rank + score) render in the body voice, explicitly forced to
 * lining+tabular figures so a column of scores stays aligned. */
.ew-num {
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: 'lnum' 1, 'tnum' 1;
  font-family: var(--ew-font-body);
}
/* …except inside .ew-table, where digits join the table's display voice. */
.ew-table .ew-num { font-family: var(--ew-font-display); }
.ew-table .ew-rank { text-align: center; width: 2.6em; color: var(--ew-ink-soft); }
.ew-table .ew-score { text-align: right; color: var(--ew-wood-dark); }
.ew-table .ew-date { white-space: nowrap; color: var(--ew-ink-soft); }

/* top-3 rank medals */
.ew-table tr.ew-top1 .ew-rank { color: var(--ew-rank-gold); }
.ew-table tr.ew-top2 .ew-rank { color: var(--ew-rank-silver); }
.ew-table tr.ew-top3 .ew-rank { color: var(--ew-rank-bronze); }
.ew-table tr.ew-top1 .ew-rank::before,
.ew-table tr.ew-top2 .ew-rank::before,
.ew-table tr.ew-top3 .ew-rank::before { content: '\2605\00a0'; /* ★ */ }

/* own row — gold plate */
.ew-table tr.ew-you td {
  background: linear-gradient(180deg, var(--ew-gold-light), var(--ew-gold));
  color: var(--ew-ink);
  font-weight: 700;
  border-bottom: 1px solid var(--ew-wood);
}
.ew-table tr.ew-you .ew-rank,
.ew-table tr.ew-you .ew-score,
.ew-table tr.ew-you .ew-date { color: var(--ew-ink); }
.ew-table tr.ew-you td:first-child { border-radius: var(--ew-radius-sm) 0 0 var(--ew-radius-sm); }
.ew-table tr.ew-you td:last-child { border-radius: 0 var(--ew-radius-sm) var(--ew-radius-sm) 0; }
.ew-you-tag {
  font-family: var(--ew-font-body);
  font-size: 0.72em;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ew-parchment);
  background: var(--ew-wood-dark);
  border-radius: 3px;
  padding: 1px 5px;
  margin-left: 6px;
  vertical-align: middle;
}

/* ---------------------------------------------------------------------------
 * Toast — brief non-modal message near the bottom.
 * ------------------------------------------------------------------------- */
.ew-toast {
  position: fixed;
  left: 50%;
  bottom: 34px;
  transform: translateX(-50%);
  z-index: 60;
  background: linear-gradient(180deg, var(--ew-wood), var(--ew-wood-dark));
  color: var(--ew-parchment);
  border: 2px solid var(--ew-gold);
  border-radius: var(--ew-radius-sm);
  box-shadow: var(--ew-shadow);
  /* Toast is transient chrome, not a reading surface → the accent voice. */
  font-family: var(--ew-font-accent);
  font-size: clamp(13px, 1.3vw, 15px);
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.6;
  padding: 12px 18px;
  max-width: 80vw;
  text-align: center;
  pointer-events: none;
}

/* ---------------------------------------------------------------------------
 * Leaderboard extras (table itself is .ew-table above).
 * ------------------------------------------------------------------------- */
.ew-lb-empty { font-size: clamp(14px, 1.4vw, 15px); color: var(--ew-ink-soft); text-align: center; padding: 24px 0; }
.ew-lb-pb { font-size: clamp(13px, 1.3vw, 14px); color: var(--ew-ink-soft); margin: var(--ew-sp-4) 0 0; text-align: right; }
.ew-lb-pb strong { color: var(--ew-wood-dark); font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------------------------
 * Mining results breakdown (cave).
 * ------------------------------------------------------------------------- */
.ew-breakdown { font-size: clamp(15px, 1.5vw, 16px); line-height: 2; margin: 0 0 var(--ew-sp-3); }
.ew-breakdown > div { display: flex; justify-content: space-between; border-bottom: 1px solid rgba(107, 74, 47, 0.22); padding: 3px 0; }
.ew-breakdown > div > span:last-child { font-variant-numeric: tabular-nums; font-weight: 600; }
.ew-breakdown .ew-total { border-bottom: none; margin-top: var(--ew-sp-1); font-weight: 700; }
.ew-breakdown .ew-total span { color: var(--ew-wood-dark); }
.ew-submit { font-size: clamp(13px, 1.3vw, 14px); margin: 0 0 var(--ew-sp-2); text-align: center; }
.ew-ok { color: var(--ew-green); font-weight: 700; }
.ew-warn { color: var(--ew-danger); font-weight: 700; }

/* ---------------------------------------------------------------------------
 * Credits — the bundled attribution text (rendered from Markdown).
 * ------------------------------------------------------------------------- */
.ew-credits { font-family: var(--ew-font-body); font-size: clamp(14px, 1.4vw, 15px); line-height: 1.65; }
.ew-credits p { margin: 0 0 10px; }
.ew-credits a { color: var(--ew-wood-dark); font-weight: 600; }
.ew-credits hr { border: none; border-top: 2px solid var(--ew-wood); opacity: 0.4; margin: 18px 0; }
.ew-credits blockquote {
  border-left: 3px solid var(--ew-gold);
  margin: 0 0 12px;
  padding: 6px 0 6px 12px;
  color: var(--ew-ink-soft);
  background: rgba(201, 150, 43, 0.08);
}
.ew-credits ul { margin: 0 0 12px; padding-left: 20px; }
.ew-credits li { margin: 3px 0; }
.ew-credits code {
  background: var(--ew-parchment-dark);
  padding: 1px 5px;
  border-radius: 3px;
  color: var(--ew-wood-dark);
  /* Kept in the body voice (not a monospace stray — P2.8 keeps the app to its
     allowed families); the tinted background still marks it as a code/path. */
  font-family: var(--ew-font-body);
  font-size: 0.94em;
}
.ew-credits table { font-size: clamp(12px, 1.2vw, 13px); }

/* ---------------------------------------------------------------------------
 * Skill tree (skilltree.ts) — fullscreen-ish parchment panel; SVG edges under
 * absolutely-positioned nodes. Node/edge positions are inline (computed from
 * the layout canvas); everything visual lives here. Icons are 32px Shikashi
 * cells shown at exactly 2× (64px) — integer scale only, pixelated.
 * ------------------------------------------------------------------------- */
.ew-panel.ew-skilltree {
  width: min(1240px, 95vw);
  height: min(880px, 93vh);
  max-height: 93vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: clamp(14px, 1.8vw, 22px) clamp(16px, 2.2vw, 26px);
}
.ew-skilltree .ew-sk-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ew-sp-3);
}
.ew-skilltree .ew-sk-head h2 { margin: 0; }
.ew-skilltree .ew-sk-close { padding: 6px 14px; font-size: 15px; }
.ew-skilltree .ew-sk-area {
  position: relative;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.ew-skilltree .ew-sk-edges {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

/* Node — a flex column centred on its (inline) left; top aligns the circle. */
.ew-skilltree .ew-sk-node {
  position: absolute;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 110px;
  cursor: pointer;
}
.ew-skilltree .ew-sk-circle {
  box-sizing: content-box; /* width/height are the icon box; the ring adds on */
  border: 3px solid var(--ew-sk-accent);
  border-radius: 50%;
  background: var(--ew-parchment-light);
  box-shadow: var(--ew-shadow-sm);
  display: flex;
  align-items: center;
  justify-content: center;
}
.ew-skilltree .ew-sk-icon {
  width: 64px;
  height: 64px;
  background-image: url('/assets/icons/shikashi.png'); /* = ICON_SHEET.url */
  background-repeat: no-repeat;
  background-size: 1024px auto; /* 16 cols × 64px = the sheet at exactly 2× */
  image-rendering: pixelated;
}
/* rank 5 — gold ring + soft glow */
.ew-skilltree .ew-sk-node.r5 .ew-sk-circle {
  border-color: var(--ew-gold);
  box-shadow: 0 0 0 2px rgba(230, 184, 79, 0.35), 0 0 14px 3px rgba(201, 150, 43, 0.45);
}
/* ulti — the one castable: square node (WoW active convention) + gold glow */
.ew-skilltree .ew-sk-node.ulti .ew-sk-circle {
  border-radius: 14px;
  border-color: var(--ew-gold);
  box-shadow: 0 0 0 2px rgba(230, 184, 79, 0.35), 0 0 16px 4px rgba(201, 150, 43, 0.5);
}
/* rank 0 — unlearned/abandoned: dim, grayscale, dashed ring */
.ew-skilltree .ew-sk-node.r0 { filter: grayscale(1); opacity: 0.45; }
.ew-skilltree .ew-sk-node.r0 .ew-sk-circle { border-style: dashed; }

.ew-skilltree .ew-sk-label {
  margin-top: 4px;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.15;
  color: var(--ew-ink);
  text-align: center;
  text-shadow: 0 1px 0 rgba(255, 250, 240, 0.7);
}

/* rank pips — five tiny squares under the label */
.ew-skilltree .ew-sk-pips { display: inline-flex; gap: 3px; margin-top: 3px; }
.ew-skilltree .ew-sk-pip {
  width: 7px;
  height: 7px;
  border-radius: 2px;
  background: rgba(58, 42, 26, 0.16);
  box-shadow: inset 0 0 0 1px rgba(58, 42, 26, 0.25);
}
.ew-skilltree .ew-sk-pip.on { background: var(--ew-sk-accent, var(--ew-wood)); box-shadow: none; }
.ew-skilltree .ew-sk-pips.gold .ew-sk-pip.on { background: var(--ew-gold); }

/* root badge — replaces the pips under LIZ */
.ew-skilltree .ew-sk-badge {
  margin-top: 3px;
  font-family: var(--ew-font-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--ew-ink);
  background: linear-gradient(180deg, var(--ew-gold-light), var(--ew-gold));
  border: 1px solid var(--ew-wood-dark);
  border-radius: 999px;
  padding: 0 8px;
  line-height: 1.5;
}

/* tooltip — a small parchment card beside the hovered/clicked node */
.ew-skilltree .ew-sk-tip {
  position: absolute;
  z-index: 10;
  width: max-content;
  max-width: 250px;
  background: var(--ew-parchment-light);
  border: 2px solid var(--ew-wood);
  border-radius: var(--ew-radius-sm);
  box-shadow: var(--ew-shadow-sm);
  padding: 8px 12px 9px;
  pointer-events: none;
}
.ew-skilltree .ew-sk-tip-name {
  font-family: var(--ew-font-display);
  font-size: 17px;
  color: var(--ew-green-dark);
  line-height: 1.25;
  margin-bottom: 1px;
}
.ew-skilltree .ew-sk-tip .ew-sk-pip { width: 8px; height: 8px; }
.ew-skilltree .ew-sk-tip-flavor {
  margin-top: 4px;
  font-family: var(--ew-font-accent);
  font-style: italic;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--ew-ink-soft);
}

/* ---------------------------------------------------------------------------
 * Quest log (questlog.ts) — a centered parchment column; one entry per quest.
 * Status chips reuse the visual language of the old desktop quest chips
 * (★/✓/◆/✗/⚑), recoloured onto parchment with the theme accents.
 * ------------------------------------------------------------------------- */
.ew-panel.ew-questlog {
  width: min(640px, 92vw);
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: clamp(14px, 1.8vw, 22px) clamp(16px, 2.2vw, 26px);
}
.ew-questlog .ew-ql-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ew-sp-3);
}
.ew-questlog .ew-ql-head h2 { margin: 0; }
.ew-questlog .ew-ql-close { padding: 6px 14px; font-size: 15px; }
.ew-questlog .ew-ql-list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  margin-top: var(--ew-sp-3);
  padding-right: 4px; /* keep the scrollbar off the entries */
}

.ew-questlog .ew-ql-quest {
  padding: 10px 12px;
  border-bottom: 1px dotted rgba(107, 74, 47, 0.4);
}
.ew-questlog .ew-ql-quest:last-child { border-bottom: none; }
/* active quest — subtle gold left-border so the current chapter stands out */
.ew-questlog .ew-ql-quest.q-active {
  border-left: 3px solid var(--ew-gold);
  background: rgba(201, 150, 43, 0.08);
  border-radius: var(--ew-radius-sm);
}
/* abandoned quest — knocked back */
.ew-questlog .ew-ql-quest.q-dead { opacity: 0.75; }

.ew-questlog .ew-ql-top {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.ew-questlog .ew-ql-chip {
  font-family: var(--ew-font-accent);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  white-space: nowrap;
  border-radius: 3px;
  padding: 1px 6px;
}
.ew-questlog .ew-ql-chip.q-active   { background: linear-gradient(180deg, var(--ew-gold-light), var(--ew-gold)); color: var(--ew-ink); }
.ew-questlog .ew-ql-chip.q-done     { background: rgba(51, 81, 63, 0.14); color: var(--ew-green-dark); }
.ew-questlog .ew-ql-chip.q-side     { background: rgba(107, 74, 47, 0.16); color: var(--ew-wood-dark); }
.ew-questlog .ew-ql-chip.q-dead     { background: rgba(181, 70, 46, 0.12); color: var(--ew-danger); }
.ew-questlog .ew-ql-chip.q-tutorial { background: rgba(58, 42, 26, 0.1); color: var(--ew-ink-soft); }
.ew-questlog .ew-ql-name { font-weight: 700; font-size: 16px; color: var(--ew-ink); }
.ew-questlog .ew-ql-meta { margin-left: auto; font-size: 13px; color: var(--ew-ink-soft); }
.ew-questlog .ew-ql-note { font-size: 14.5px; line-height: 1.5; color: var(--ew-ink-soft); margin-top: 3px; }
.ew-questlog .ew-ql-links { display: flex; gap: 14px; margin-top: 4px; font-size: 13.5px; }
.ew-questlog .ew-ql-links a { color: var(--ew-wood-dark); font-weight: 600; }

/* ---------------------------------------------------------------------------
 * Bag (bag.ts) — small centered parchment panel; a 4×2 grid of item slots.
 * Icons are 32px Shikashi cells shown at exactly 2× (64px) — integer scale
 * only, pixelated. Filled slots carry a hover tooltip (same parchment card as
 * the skill tree's .ew-sk-tip); empty slots read recessed and darker.
 * ------------------------------------------------------------------------- */
.ew-panel.ew-bag {
  width: min(440px, 92vw);
  padding: clamp(14px, 1.8vw, 22px) clamp(16px, 2.2vw, 26px);
}
.ew-bag .ew-bag-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ew-sp-3);
}
.ew-bag .ew-bag-head h2 { margin: 0; }
.ew-bag .ew-bag-close { padding: 6px 14px; font-size: 15px; }
.ew-bag .ew-bag-grid {
  margin-top: var(--ew-sp-3);
  display: grid;
  grid-template-columns: repeat(4, 84px);
  gap: 10px;
  justify-content: center;
}
.ew-bag .ew-bag-slot {
  position: relative;
  width: 84px;
  height: 84px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--ew-parchment-light);
  border: 2px solid var(--ew-wood);
  border-radius: var(--ew-radius-sm);
  box-shadow: var(--ew-shadow-sm);
}
/* empty slot — recessed and darker, no tooltip */
.ew-bag .ew-bag-slot.empty {
  background: var(--ew-parchment-dark);
  border-style: dashed;
  border-color: color-mix(in srgb, var(--ew-wood) 50%, transparent);
  box-shadow: inset 0 2px 6px rgba(58, 42, 26, 0.2);
}
.ew-bag .ew-bag-icon {
  width: 64px;
  height: 64px;
  background-image: url('/assets/icons/shikashi.png'); /* = ICON_SHEET.url */
  background-repeat: no-repeat;
  background-size: 1024px auto; /* 16 cols × 64px = the sheet at exactly 2× */
  image-rendering: pixelated;
}
/* tooltip — a small parchment card above the hovered slot */
.ew-bag .ew-bag-tip {
  display: none;
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  width: max-content;
  max-width: 230px;
  background: var(--ew-parchment-light);
  border: 2px solid var(--ew-wood);
  border-radius: var(--ew-radius-sm);
  box-shadow: var(--ew-shadow-sm);
  padding: 8px 12px 9px;
  pointer-events: none;
  text-align: left;
}
.ew-bag .ew-bag-slot:hover .ew-bag-tip { display: block; }
.ew-bag .ew-bag-tip-name {
  font-family: var(--ew-font-display);
  font-size: 17px;
  color: var(--ew-green-dark);
  line-height: 1.25;
}
.ew-bag .ew-bag-tip-flavor {
  margin-top: 2px;
  font-family: var(--ew-font-accent);
  font-style: italic;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--ew-ink-soft);
}

/* ---------------------------------------------------------------------------
 * HUD buttons — the persistent map/skills/quests/bag icon cluster in the
 * world scene's corner. Styled after the prompt bar (ink plate, gold-light
 * edge). Each button holds a 64px Shikashi icon (2× — integer scale only,
 * pixelated), a key badge in its corner, and a hover tooltip (same pattern
 * as the bag slots). The .ew-hud-hints row owns the fixed corner position.
 * ------------------------------------------------------------------------- */
.ew-hud-hints {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 40; /* under overlays (50) */
  display: flex;
  gap: 8px;
}
.ew-hud-btn {
  position: relative;
  padding: 6px;
  background: rgba(58, 42, 26, 0.82);
  border: 1px solid rgba(230, 184, 79, 0.6);
  border-radius: 8px;
  cursor: pointer;
  user-select: none;
}
.ew-hud-btn:hover { background: rgba(58, 42, 26, 0.95); border-color: var(--ew-gold-light); }
.ew-hud-icon {
  width: 64px;
  height: 64px;
  background-image: url('/assets/icons/shikashi.png'); /* = ICON_SHEET.url */
  background-repeat: no-repeat;
  background-size: 1024px auto; /* 16 cols × 64px = the sheet at exactly 2× */
  image-rendering: pixelated;
}
.ew-hud-key {
  position: absolute;
  right: 3px;
  bottom: 3px;
  font-family: var(--ew-font-accent);
  font-weight: 700;
  font-size: 12px;
  line-height: 1;
  color: var(--ew-gold-light);
  background: rgba(58, 42, 26, 0.92);
  border: 1px solid rgba(230, 184, 79, 0.6);
  border-radius: 5px;
  padding: 2px 5px;
  pointer-events: none;
}
/* tooltip — a small ink pill above the hovered button */
.ew-hud-tip {
  display: none;
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  font-family: var(--ew-font-accent);
  font-size: 14px;
  letter-spacing: 0.02em;
  color: var(--ew-parchment);
  background: rgba(58, 42, 26, 0.92);
  border: 1px solid rgba(230, 184, 79, 0.6);
  border-radius: 8px;
  padding: 4px 10px;
  pointer-events: none;
}
.ew-hud-btn:hover .ew-hud-tip { display: block; }

/* ---------------------------------------------------------------------------
 * Minimap (minimap.ts) — fixed top-right canvas, world scene only. Same ink
 * plate + gold edge as the HUD buttons; the canvas paints 40×30 tiles at 4
 * CSS px each (2× internal resolution, pixelated).
 * ------------------------------------------------------------------------- */
.ew-minimap {
  position: fixed;
  right: 16px;
  top: 16px;
  z-index: 40; /* under overlays (50) */
  background: rgba(58, 42, 26, 0.82);
  border: 1px solid rgba(230, 184, 79, 0.6);
  border-radius: 8px;
  padding: 4px;
}
.ew-minimap canvas {
  display: block;
  width: 160px;
  height: 120px;
  image-rendering: pixelated;
  border-radius: 4px;
}
/*! 98.css v0.1.21 - https://github.com/jdan/98.css */@font-face{font-family:"Pixelated MS Sans Serif";font-style:normal;font-weight:400;src:url(/assets/ms_sans_serif-C3pax6mQ.woff) format("woff");src:url(/assets/ms_sans_serif-Du8rjN1q.woff2) format("woff2")}@font-face{font-family:"Pixelated MS Sans Serif";font-style:normal;font-weight:700;src:url(/assets/ms_sans_serif_bold-B8yxhAcs.woff) format("woff");src:url(/assets/ms_sans_serif_bold-D5dpRRHG.woff2) format("woff2")}body{color:#222;font-family:Arial;font-size:12px}.title-bar,.window,button,input,label,legend,li[role=tab],option,select,table,textarea,ul.tree-view{-webkit-font-smoothing:none;font-family:"Pixelated MS Sans Serif",Arial;font-size:11px}h1{font-size:5rem}h2{font-size:2.5rem}h3{font-size:2rem}h4{font-size:1.5rem}u{border-bottom:.5px solid #222;text-decoration:none}button,input[type=reset],input[type=submit]{background:silver;border:none;border-radius:0;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf;box-sizing:border-box;color:transparent;min-height:23px;min-width:75px;padding:0 12px;text-shadow:0 0 #222}button.default,input[type=reset].default,input[type=submit].default{box-shadow:inset -2px -2px #0a0a0a,inset 1px 1px #0a0a0a,inset 2px 2px #fff,inset -3px -3px grey,inset 3px 3px #dfdfdf}.vertical-bar{background:silver;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf;height:20px;width:4px}button:not(:disabled):active,input[type=reset]:not(:disabled):active,input[type=submit]:not(:disabled):active{box-shadow:inset -1px -1px #fff,inset 1px 1px #0a0a0a,inset -2px -2px #dfdfdf,inset 2px 2px grey;text-shadow:1px 1px #222}button.default:not(:disabled):active,input[type=reset].default:not(:disabled):active,input[type=submit].default:not(:disabled):active{box-shadow:inset 2px 2px #0a0a0a,inset -1px -1px #0a0a0a,inset -2px -2px #fff,inset 3px 3px grey,inset -3px -3px #dfdfdf}@media (not(hover)){button:not(:disabled):hover,input[type=reset]:not(:disabled):hover,input[type=submit]:not(:disabled):hover{box-shadow:inset -1px -1px #fff,inset 1px 1px #0a0a0a,inset -2px -2px #dfdfdf,inset 2px 2px grey}}button:focus,input[type=reset]:focus,input[type=submit]:focus{outline:1px dotted #000;outline-offset:-4px}button::-moz-focus-inner,input[type=reset]::-moz-focus-inner,input[type=submit]::-moz-focus-inner{border:0}:disabled,:disabled+label,input[readonly],input[readonly]+label{color:grey}:disabled+label,button:disabled,input[type=reset]:disabled,input[type=submit]:disabled{text-shadow:1px 1px 0 #fff}.window{background:silver;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #dfdfdf,inset -2px -2px grey,inset 2px 2px #fff;padding:3px}.title-bar{align-items:center;background:linear-gradient(90deg,navy,#1084d0);display:flex;justify-content:space-between;padding:3px 2px 3px 3px}.title-bar.inactive{background:linear-gradient(90deg,grey,#b5b5b5)}.title-bar-text{color:#fff;font-weight:700;letter-spacing:0;margin-right:24px}.title-bar-controls{display:flex}.title-bar-controls button{display:block;min-height:14px;min-width:16px;padding:0}.title-bar-controls button:active{padding:0}.title-bar-controls button:focus{outline:none}.title-bar-controls button[aria-label=Minimize],.title-bar-controls button[aria-label].minimize{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='6' height='2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M0 0h6v2H0z'/%3E%3C/svg%3E");background-position:bottom 3px left 4px;background-repeat:no-repeat}.title-bar-controls button[aria-label=Maximize],.title-bar-controls button[aria-label].maximize{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='9' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 0H0v9h9V0zM8 2H1v6h7V2z' fill='%23000'/%3E%3C/svg%3E");background-position:top 2px left 3px;background-repeat:no-repeat}.title-bar-controls button[aria-label=Maximize]:disabled,.title-bar-controls button[aria-label].maximize:disabled{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='10' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 1H1v9h9V1zM9 3H2v6h7V3z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 0H0v9h9V0zM8 2H1v6h7V2z' fill='gray'/%3E%3C/svg%3E");background-position:top 2px left 3px;background-repeat:no-repeat}.title-bar-controls button[aria-label=Restore],.title-bar-controls button[aria-label].restore{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M2 0h6v2H2zM7 2h1v4H7zM2 2h1v1H2zM6 5h1v1H6zM0 3h6v2H0zM5 5h1v4H5zM0 5h1v4H0zM1 8h4v1H1z'/%3E%3C/svg%3E");background-position:top 2px left 3px;background-repeat:no-repeat}.title-bar-controls button[aria-label=Help],.title-bar-controls button[aria-label].help{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='6' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M0 1h2v2H0zM1 0h4v1H1zM4 1h2v2H4zM3 3h2v1H3zM2 4h2v2H2zM2 7h2v2H2z'/%3E%3C/svg%3E");background-position:top 2px left 5px;background-repeat:no-repeat}.title-bar-controls button[aria-label=Close],.title-bar-controls button[aria-label].close{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h2v1h1v1h2V1h1V0h2v1H7v1H6v1H5v1h1v1h1v1h1v1H6V6H5V5H3v1H2v1H0V6h1V5h1V4h1V3H2V2H1V1H0V0z' fill='%23000'/%3E%3C/svg%3E");background-position:top 3px left 4px;background-repeat:no-repeat;margin-left:2px}.status-bar{gap:1px;display:flex;margin:0 1px}.status-bar-field{box-shadow:inset -1px -1px #dfdfdf,inset 1px 1px grey;flex-grow:1;margin:0;padding:2px 3px}.window-body{margin:8px}fieldset{border-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='5' height='5' fill='gray' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h5v5H0V2h2v1h1V2H0' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h4v4H0V1h1v2h2V1H0'/%3E%3C/svg%3E") 2;margin:0;padding:10px;padding-block-start:8px}legend{background:silver}.field-row{align-items:center;display:flex}[class^=field-row]+[class^=field-row]{margin-top:6px}.field-row>*+*{margin-left:6px}.field-row-stacked{display:flex;flex-direction:column}.field-row-stacked *+*{margin-top:6px}label{align-items:center;display:inline-flex;user-select:none}input[type=checkbox],input[type=radio]{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:0;border:none;margin:0;opacity:0;position:fixed}input[type=checkbox]+label,input[type=radio]+label{line-height:13px}input[type=radio]+label{margin-left:18px;position:relative}input[type=radio]+label:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0H4v1H2v1H1v2H0v4h1v2h1V8H1V4h1V2h2V1h4v1h2V1H8V0z' fill='gray'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 1H4v1H2v2H1v4h1v1h1V8H2V4h1V3h1V2h4v1h2V2H8V1z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 3h1v1H9V3zm1 5V4h1v4h-1zm-2 2V9h1V8h1v2H8zm-4 0v1h4v-1H4zm0 0V9H2v1h2z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 2h-1v2h1v4h-1v2H8v1H4v-1H2v1h2v1h4v-1h2v-1h1V8h1V4h-1V2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2h4v1h1v1h1v4H9v1H8v1H4V9H3V8H2V4h1V3h1V2z' fill='%23fff'/%3E%3C/svg%3E");content:"";display:inline-block;height:12px;left:-18px;margin-right:6px;position:absolute;top:0;width:12px}input[type=radio]:active+label:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0H4v1H2v1H1v2H0v4h1v2h1V8H1V4h1V2h2V1h4v1h2V1H8V0z' fill='gray'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 1H4v1H2v2H1v4h1v1h1V8H2V4h1V3h1V2h4v1h2V2H8V1z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 3h1v1H9V3zm1 5V4h1v4h-1zm-2 2V9h1V8h1v2H8zm-4 0v1h4v-1H4zm0 0V9H2v1h2z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 2h-1v2h1v4h-1v2H8v1H4v-1H2v1h2v1h4v-1h2v-1h1V8h1V4h-1V2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2h4v1h1v1h1v4H9v1H8v1H4V9H3V8H2V4h1V3h1V2z' fill='silver'/%3E%3C/svg%3E")}input[type=radio]:checked+label:after{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='4' height='4' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3 0H1v1H0v2h1v1h2V3h1V1H3V0z' fill='%23000'/%3E%3C/svg%3E");content:"";display:block;height:4px;left:-14px;position:absolute;top:4px;width:4px}input[type=checkbox]:focus+label,input[type=radio]:focus+label{outline:1px dotted #000}input[type=radio][disabled]+label:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0H4v1H2v1H1v2H0v4h1v2h1V8H1V4h1V2h2V1h4v1h2V1H8V0z' fill='gray'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 1H4v1H2v2H1v4h1v1h1V8H2V4h1V3h1V2h4v1h2V2H8V1z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 3h1v1H9V3zm1 5V4h1v4h-1zm-2 2V9h1V8h1v2H8zm-4 0v1h4v-1H4zm0 0V9H2v1h2z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 2h-1v2h1v4h-1v2H8v1H4v-1H2v1h2v1h4v-1h2v-1h1V8h1V4h-1V2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2h4v1h1v1h1v4H9v1H8v1H4V9H3V8H2V4h1V3h1V2z' fill='silver'/%3E%3C/svg%3E")}input[type=radio][disabled]:checked+label:after{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='4' height='4' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3 0H1v1H0v2h1v1h2V3h1V1H3V0z' fill='gray'/%3E%3C/svg%3E")}input[type=checkbox]+label{margin-left:19px;position:relative}input[type=checkbox]+label:before{background:#fff;box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;content:"";display:inline-block;height:13px;left:-19px;margin-right:6px;position:absolute;width:13px}input[type=checkbox]:active+label:before{background:silver}input[type=checkbox]:checked+label:after{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='7' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 0H6v1H5v1H4v1H3v1H2V3H1V2H0v3h1v1h1v1h1V6h1V5h1V4h1V3h1V0z' fill='%23000'/%3E%3C/svg%3E");content:"";display:block;height:7px;left:-16px;position:absolute;width:7px}input[type=checkbox][disabled]+label:before{background:silver}input[type=checkbox][disabled]:checked+label:after{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='7' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 0H6v1H5v1H4v1H3v1H2V3H1V2H0v3h1v1h1v1h1V6h1V5h1V4h1V3h1V0z' fill='gray'/%3E%3C/svg%3E")}input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url]{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:0}input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],select{background-color:#fff;box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;box-sizing:border-box;padding:3px 4px}select,textarea{border:none}textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-radius:0;box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;box-sizing:border-box;padding:3px 4px}input[type=email],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],select{height:21px}input[type=number]{height:22px}input[type=search]::-ms-clear,input[type=search]::-ms-reveal{display:none;height:0;width:0}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url]{line-height:2}input[type=email]:disabled,input[type=email]:read-only,input[type=number]:disabled,input[type=number]:read-only,input[type=password]:disabled,input[type=password]:read-only,input[type=search]:disabled,input[type=search]:read-only,input[type=tel]:disabled,input[type=tel]:read-only,input[type=text]:disabled,input[type=text]:read-only,input[type=url]:disabled,input[type=url]:read-only,textarea:disabled{background-color:silver}select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0v16h1V1h14V0z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1v14h1V2h12V1H2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H0v-1h15V0h1v17z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1h-1v14H1v1h14V1z' fill='gray'/%3E%3Cpath fill='silver' d='M2 2h12v13H2z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 6H4v1h1v1h1v1h1v1h1V9h1V8h1V7h1V6z' fill='%23000'/%3E%3C/svg%3E");background-position:top 2px right 2px;background-repeat:no-repeat;border-radius:0;padding-right:32px;position:relative}input[type=email]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=url]:focus,select:focus,textarea:focus{outline:none}input[type=range]{-webkit-appearance:none;background:transparent;width:100%}input[type=range]:focus{outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v16h2v2h2v2h1v-1H3v-2H1V1h9V0z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1 1v15h1v1h1v1h1v1h2v-1h1v-1h1v-1h1V1z' fill='%23C0C7C8'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v15H8v2H6v2H5v-1h2v-2h2z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v16H9v2H7v2H5v1h1v-2h2v-2h2z' fill='%23000'/%3E%3C/svg%3E");border:none;box-shadow:none;height:21px;transform:translateY(-8px);width:11px}input[type=range].has-box-indicator::-webkit-slider-thumb{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v20h1V1h9V0z' fill='%23fff'/%3E%3Cpath fill='%23C0C7C8' d='M1 1h8v18H1z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v19H1v-1h8z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v21H0v-1h10z' fill='%23000'/%3E%3C/svg%3E");transform:translateY(-10px)}input[type=range]::-moz-range-thumb{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v16h2v2h2v2h1v-1H3v-2H1V1h9V0z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1 1v15h1v1h1v1h1v1h2v-1h1v-1h1v-1h1V1z' fill='%23C0C7C8'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v15H8v2H6v2H5v-1h2v-2h2z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v16H9v2H7v2H5v1h1v-2h2v-2h2z' fill='%23000'/%3E%3C/svg%3E");border:0;border-radius:0;height:21px;transform:translateY(2px);width:11px}input[type=range].has-box-indicator::-moz-range-thumb{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v20h1V1h9V0z' fill='%23fff'/%3E%3Cpath fill='%23C0C7C8' d='M1 1h8v18H1z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v19H1v-1h8z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v21H0v-1h10z' fill='%23000'/%3E%3C/svg%3E");transform:translateY(0)}input[type=range]::-webkit-slider-runnable-track{background:#000;border-bottom:1px solid grey;border-right:1px solid grey;box-shadow:1px 0 0 #fff,1px 1px 0 #fff,0 1px 0 #fff,-1px 0 0 #a9a9a9,-1px -1px 0 #a9a9a9,0 -1px 0 #a9a9a9,-1px 1px 0 #fff,1px -1px #a9a9a9;box-sizing:border-box;height:2px;width:100%}input[type=range]::-moz-range-track{background:#000;border-bottom:1px solid grey;border-right:1px solid grey;box-shadow:1px 0 0 #fff,1px 1px 0 #fff,0 1px 0 #fff,-1px 0 0 #a9a9a9,-1px -1px 0 #a9a9a9,0 -1px 0 #a9a9a9,-1px 1px 0 #fff,1px -1px #a9a9a9;box-sizing:border-box;height:2px;width:100%}.is-vertical{display:inline-block;height:150px;transform:translateY(50%);width:4px}.is-vertical>input[type=range]{height:4px;margin:0 16px 0 10px;transform:rotate(270deg) translateX(calc(-50% + 8px));transform-origin:left;width:150px}.is-vertical>input[type=range]::-webkit-slider-runnable-track{border-bottom:1px solid grey;border-left:1px solid grey;border-right:0;box-shadow:-1px 0 0 #fff,-1px 1px 0 #fff,0 1px 0 #fff,1px 0 0 #a9a9a9,1px -1px 0 #a9a9a9,0 -1px 0 #a9a9a9,1px 1px 0 #fff,-1px -1px #a9a9a9}.is-vertical>input[type=range]::-moz-range-track{border-bottom:1px solid grey;border-left:1px solid grey;border-right:0;box-shadow:-1px 0 0 #fff,-1px 1px 0 #fff,0 1px 0 #fff,1px 0 0 #a9a9a9,1px -1px 0 #a9a9a9,0 -1px 0 #a9a9a9,1px 1px 0 #fff,-1px -1px #a9a9a9}.is-vertical>input[type=range]::-webkit-slider-thumb{transform:translateY(-8px) scaleX(-1)}.is-vertical>input[type=range].has-box-indicator::-webkit-slider-thumb{transform:translateY(-10px) scaleX(-1)}.is-vertical>input[type=range]::-moz-range-thumb{transform:translateY(2px) scaleX(-1)}.is-vertical>input[type=range].has-box-indicator::-moz-range-thumb{transform:translateY(0) scaleX(-1)}select:focus{background-color:navy;color:#fff}select:focus option{background-color:#fff;color:#000}select:active{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h16v17H0V0zm1 16h14V1H1v15z' fill='gray'/%3E%3Cpath fill='silver' d='M1 1h14v15H1z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 7H5v1h1v1h1v1h1v1h1v-1h1V9h1V8h1V7z' fill='%23000'/%3E%3C/svg%3E")}a{color:#00f}a:focus{outline:1px dotted #00f}ul.tree-view{background:#fff;box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;display:block;margin:0;padding:6px}ul.tree-view li{list-style-type:none}ul.tree-view a{color:#000;text-decoration:none}ul.tree-view a:focus{background-color:navy;color:#fff}ul.tree-view li,ul.tree-view ul{margin-top:3px}ul.tree-view ul{border-left:1px dotted grey;margin-left:16px;padding-left:16px}ul.tree-view ul>li{position:relative}ul.tree-view ul>li:before{border-bottom:1px dotted grey;content:"";display:block;left:-16px;position:absolute;top:6px;width:12px}ul.tree-view ul>li:last-child:after{background:#fff;bottom:0;content:"";display:block;left:-20px;position:absolute;top:7px;width:8px}ul.tree-view details{margin-top:0}ul.tree-view details[open] summary{margin-bottom:0}ul.tree-view ul details>summary:before{margin-left:-22px;position:relative;z-index:1}ul.tree-view details>summary:before{background-color:#fff;border:1px solid grey;content:"+";display:block;float:left;height:9px;line-height:8px;margin-right:5px;padding-left:1px;text-align:center;width:8px}ul.tree-view details[open]>summary:before{content:"-"}ul.tree-view details>summary::-webkit-details-marker,ul.tree-view details>summary::marker{content:""}pre{background:#fff;box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;display:block;margin:0;padding:12px 8px}code,code *{font-family:monospace}summary:focus{outline:1px dotted #000}::-webkit-scrollbar{width:16px}::-webkit-scrollbar:horizontal{height:17px}::-webkit-scrollbar-corner{background:#dfdfdf}::-webkit-scrollbar-track{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='2' height='2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1 0H0v1h1v1h1V1H1V0z' fill='silver'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 0H1v1H0v1h1V1h1V0z' fill='%23fff'/%3E%3C/svg%3E")}::-webkit-scrollbar-thumb{background-color:#dfdfdf;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf}::-webkit-scrollbar-button:horizontal:end:increment,::-webkit-scrollbar-button:horizontal:start:decrement,::-webkit-scrollbar-button:vertical:end:increment,::-webkit-scrollbar-button:vertical:start:decrement{display:block}::-webkit-scrollbar-button:vertical:start{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0v16h1V1h14V0z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1v14h1V2h12V1H2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H0v-1h15V0h1v17z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1h-1v14H1v1h14V1z' fill='gray'/%3E%3Cpath fill='silver' d='M2 2h12v13H2z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 6H7v1H6v1H5v1H4v1h7V9h-1V8H9V7H8V6z' fill='%23000'/%3E%3C/svg%3E");height:17px}::-webkit-scrollbar-button:vertical:end{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0v16h1V1h14V0z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1v14h1V2h12V1H2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H0v-1h15V0h1v17z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1h-1v14H1v1h14V1z' fill='gray'/%3E%3Cpath fill='silver' d='M2 2h12v13H2z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 6H4v1h1v1h1v1h1v1h1V9h1V8h1V7h1V6z' fill='%23000'/%3E%3C/svg%3E");height:17px}::-webkit-scrollbar-button:horizontal:start{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0v16h1V1h14V0z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1v14h1V2h12V1H2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H0v-1h15V0h1v17z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1h-1v14H1v1h14V1z' fill='gray'/%3E%3Cpath fill='silver' d='M2 2h12v13H2z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 4H8v1H7v1H6v1H5v1h1v1h1v1h1v1h1V4z' fill='%23000'/%3E%3C/svg%3E");width:16px}::-webkit-scrollbar-button:horizontal:end{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0v16h1V1h14V0z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1v14h1V2h12V1H2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H0v-1h15V0h1v17z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1h-1v14H1v1h14V1z' fill='gray'/%3E%3Cpath fill='silver' d='M2 2h12v13H2z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 4H6v7h1v-1h1V9h1V8h1V7H9V6H8V5H7V4z' fill='%23000'/%3E%3C/svg%3E");width:16px}.window[role=tabpanel]{position:relative;z-index:2}menu[role=tablist]{display:flex;list-style-type:none;margin:0 0 -2px;padding-left:3px;position:relative;text-indent:0}menu[role=tablist]>li{border-top-left-radius:3px;border-top-right-radius:3px;box-shadow:inset -1px 0 #0a0a0a,inset 1px 1px #dfdfdf,inset -2px 0 grey,inset 2px 2px #fff;z-index:1}menu[role=tablist]>li[aria-selected=true]{background-color:silver;margin-left:-3px;margin-top:-2px;padding-bottom:2px;position:relative;z-index:8}menu[role=tablist]>li>a{color:#222;display:block;margin:6px;text-decoration:none}menu[role=tablist]>li[aria-selected=true]>a:focus{outline:none}menu[role=tablist]>li>a:focus{outline:1px dotted #222}menu[role=tablist].multirows>li{flex-grow:1;text-align:center}.sunken-panel{border:2px groove transparent;border-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='5' height='5' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='gray' d='M0 0h4v1H0z'/%3E%3Cpath fill='gray' d='M0 0h1v4H0z'/%3E%3Cpath fill='%230a0a0a' d='M1 1h2v1H1z'/%3E%3Cpath fill='%230a0a0a' d='M1 1h1v2H1z'/%3E%3Cpath fill='%23fff' d='M0 4h5v1H0z'/%3E%3Cpath fill='%23fff' d='M4 0h1v5H4z'/%3E%3Cpath fill='%23dfdfdf' d='M3 1h1v3H3z'/%3E%3Cpath fill='%23dfdfdf' d='M1 3h3v1H1z'/%3E%3C/svg%3E") 2;box-sizing:border-box;overflow:auto}.sunken-panel,table{background-color:#fff}table{border-collapse:collapse;position:relative;text-align:left;white-space:nowrap}table>thead>tr>*{background:silver;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf;box-sizing:border-box;font-weight:400;height:17px;padding:0 6px;position:sticky;top:0}table.interactive>tbody>tr{cursor:pointer}table>tbody>tr.highlighted{background-color:navy;color:#fff}table>tbody>tr>*{height:14px;padding:0 6px}.progress-indicator{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:0;box-shadow:inset -2px -2px #dfdfdf,inset 2px 2px grey;box-sizing:border-box;height:32px;padding:4px;position:relative}.progress-indicator>.progress-indicator-bar{background-color:navy;display:block;height:100%}.progress-indicator.segmented>.progress-indicator-bar{background-color:transparent;background-image:linear-gradient(90deg,navy 16px,transparent 0 2px);background-repeat:repeat;background-size:18px 100%;width:100%}.field-border{background:#fff}.field-border,.field-border-disabled{box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;padding:2px}.field-border-disabled{background:silver}.status-field-border{background:silver;box-shadow:inset -1px -1px #dfdfdf,inset 1px 1px grey;padding:1px}
/*# sourceMappingURL=98.css.map */