/* Canonical product-layer values shared by StyleX and handwritten CSS. */
:root {
  --hoenn-color-field: #000000;
  --hoenn-color-field-deep: #000000;
  --hoenn-color-paper: #f8f8f8;
  --hoenn-color-paper-muted: #f8f8f8;
  --hoenn-color-paper-edge: #383838;
  --hoenn-color-panel: #f8f8f8;
  --hoenn-color-ink: #383838;
  --hoenn-color-muted: #383838;
  --hoenn-color-silver: #f8f8f8;
  --hoenn-color-silver-edge: #383838;
  --hoenn-color-control-dark: #383838;
  --hoenn-color-control-pressed: #d8d8d8;
  --hoenn-color-emerald: #f8f8f8;
  --hoenn-color-emerald-bright: #00f898;
  --hoenn-color-emerald-shadow: #00c8b8;
  --hoenn-color-emerald-soft: #f8f8f8;
  --hoenn-color-lime: #f8f8f8;
  --hoenn-color-sun: #f8f8f8;
  --hoenn-color-sun-soft: #f8f8f8;
  --hoenn-color-warning-text: #383838;
  --hoenn-color-orange: #f8f8f8;
  --hoenn-color-orange-edge: #383838;
  --hoenn-color-ruby: #f8f8f8;
  --hoenn-color-ruby-bright: #383838;
  --hoenn-color-sapphire: #f8f8f8;
  --hoenn-color-sapphire-bright: #383838;
  --hoenn-color-focus: #00c8b8;
  --hoenn-color-frame: #000000;
  --hoenn-color-danger: #f8f8f8;
  --hoenn-color-danger-edge: #383838;

  /* Semantic color pairs. Components must consume the surface and its
     corresponding on-color together so palette changes cannot strand a light
     foreground on a light surface (or the inverse). */
  --hoenn-color-surface-paper: var(--hoenn-color-paper);
  --hoenn-color-on-surface-paper: var(--hoenn-color-ink);
  --hoenn-color-surface-panel: var(--hoenn-color-panel);
  --hoenn-color-on-surface-panel: var(--hoenn-color-ink);
  --hoenn-color-on-surface-panel-muted: var(--hoenn-color-muted);
  --hoenn-color-control-light: var(--hoenn-color-silver);
  --hoenn-color-on-control-light: var(--hoenn-color-ink);
  --hoenn-color-control-ghost: var(--hoenn-color-paper);
  --hoenn-color-on-control-ghost: var(--hoenn-color-ink);
  --hoenn-color-control-primary: var(--hoenn-color-emerald);
  --hoenn-color-on-control-primary: var(--hoenn-color-ink);
  --hoenn-color-control-disabled: var(--hoenn-color-paper-muted);
  --hoenn-color-on-control-disabled: var(--hoenn-color-control-dark);
  --hoenn-font-family: "Emerald Dialogue";
  --hoenn-radius-control: 0;
  --hoenn-radius-compact: 0;
  --hoenn-radius-frame: 0;
  --hoenn-content-width: none;
  --hoenn-shadow-control: 0 2px 0 var(--hoenn-color-emerald-shadow);
  --hoenn-shadow-control-hover: 0 3px 0 var(--hoenn-color-emerald-shadow);
  --hoenn-shadow-control-active: 0 0 0 var(--hoenn-color-emerald-shadow);
  --hoenn-shadow-focus: 0 0 0 3px var(--hoenn-color-focus);
  --hoenn-field-pattern: none;
}
.x7z7khe{padding:10px}
.xv4hg3u:not(#\#){border-color:var(--hoenn-color-emerald-bright)}
.xm51hlo:not(#\#){border-color:var(--hoenn-color-silver-edge)}
.x13mw7xc:not(#\#){border-color:var(--hoenn-color-ruby-bright)}
.xajnr8g:not(#\#){border-color:var(--hoenn-color-orange-edge)}
.x1m2lgeh:not(#\#){border-color:var(--hoenn-color-sapphire-bright)}
.x1r17370:not(#\#){border-color:var(--hoenn-color-paper)}
.x1r9q5f2:not(#\#){border-radius:var(--hoenn-radius-frame)}
.x142a20a:not(#\#){border-radius:var(--hoenn-radius-compact)}
.x29t5f:not(#\#){border-radius:var(--hoenn-radius-control)}
.x1y0btm7:not(#\#){border-style:solid}
.xdh2fpr:not(#\#){border-width:2px}
.x9r2w2z:not(#\#){border-width:3px}
.xmmi0ta:not(#\#){gap:9px}
.xvueqy4:not(#\#){margin-inline:auto}
.x1a2a7pz:not(#\#){outline:none}
.xlkn9b3:not(#\#){padding-inline:7px}
.xm4azdq:disabled:not(#\#){border-color:var(--hoenn-color-paper-edge)}
.x6s0dn4:not(#\#):not(#\#){align-items:center}
.x1p95r2s:not(#\#):not(#\#){background-color:var(--hoenn-color-frame)}
.x18w10z0:not(#\#):not(#\#){background-color:var(--hoenn-color-surface-panel)}
.x1rv7aas:not(#\#):not(#\#){background-color:var(--hoenn-color-sapphire)}
.x1n2mqls:not(#\#):not(#\#){background-color:var(--hoenn-color-control-primary)}
.xqutv4n:not(#\#):not(#\#){background-color:var(--hoenn-color-lime)}
.x1w6e9qt:not(#\#):not(#\#){background-color:var(--hoenn-color-surface-paper)}
.x1m745v6:not(#\#):not(#\#){background-color:var(--hoenn-color-orange)}
.xcgym89:not(#\#):not(#\#){background-color:var(--hoenn-color-control-ghost)}
.x1c8mmf:not(#\#):not(#\#){background-color:var(--hoenn-color-ruby)}
.x1fq3bti:not(#\#):not(#\#){background-color:var(--hoenn-color-control-light)}
.x1evq6as:not(#\#):not(#\#){box-shadow:0 6px 24px rgb(17 24 19 / 35%)}
.x1tu81ri:not(#\#):not(#\#){box-shadow:inset 0 -1px 0 var(--hoenn-color-emerald-bright)}
.x14hf86c:not(#\#):not(#\#){box-shadow:inset 0 1px 0 var(--hoenn-color-emerald-bright)}
.x1gnnqk1:not(#\#):not(#\#){box-shadow:none}
.xb7u2yd:not(#\#):not(#\#){box-shadow:var(--hoenn-shadow-control)}
.x1g7v0hd:not(#\#):not(#\#){color:var(--hoenn-color-on-control-ghost)}
.x1ideua4:not(#\#):not(#\#){color:var(--hoenn-color-on-control-primary)}
.x1do5g1t:not(#\#):not(#\#){color:var(--hoenn-color-on-surface-paper)}
.x1f5k5fj:not(#\#):not(#\#){color:var(--hoenn-color-ink)}
.x179vtdo:not(#\#):not(#\#){color:var(--hoenn-color-on-control-light)}
.xezuzlo:not(#\#):not(#\#){color:var(--hoenn-color-on-surface-panel-muted)}
.x1pskrcc:not(#\#):not(#\#){color:var(--hoenn-color-on-surface-panel)}
.x3nfvp2:not(#\#):not(#\#){display:inline-flex}
.x1q0g3np:not(#\#):not(#\#){flex-direction:row}
.x1qw8zz:not(#\#):not(#\#){font-family:var(--hoenn-font-family)}
.x1pvqxga:not(#\#):not(#\#){font-size:24px}
.xss6m8b:not(#\#):not(#\#){font-variant-numeric:tabular-nums}
.xo1l8bm:not(#\#):not(#\#){font-weight:400}
.xl56j7k:not(#\#):not(#\#){justify-content:center}
.x12oo3zp:not(#\#):not(#\#){letter-spacing:0}
.xo5v014:not(#\#):not(#\#){line-height:1}
.x6bc4kz:not(#\#):not(#\#){transition-duration:.09s}
.xhd6ntr:not(#\#):not(#\#){transition-property:box-shadow,transform}
.x9lcvmn:not(#\#):not(#\#){transition-timing-function:ease-out}
.xhbeuh9:focus-visible:not(#\#):not(#\#){box-shadow:var(--hoenn-shadow-focus)}
.xkeni10:disabled:not(#\#):not(#\#){background-color:var(--hoenn-color-control-disabled)}
.x1rudlt0:disabled:not(#\#):not(#\#){box-shadow:none}
.xr8w2ir:disabled:not(#\#):not(#\#){color:var(--hoenn-color-on-control-disabled)}
.x1s07b3s:disabled:not(#\#):not(#\#){cursor:not-allowed}
.x1gl3shj:disabled:not(#\#):not(#\#){transform:none}
.xhiywf8:active:not(#\#):not(#\#){box-shadow:var(--hoenn-shadow-control-active)}
.x1sjarlb:active:not(#\#):not(#\#){transform:translateY(2px)}
@media (max-width: 640px){.x1kicciy.x1kicciy:not(#\#):not(#\#){font-size:20px}}
@media (hover: hover){.x1h6xaec.x1h6xaec:hover:not(#\#):not(#\#){box-shadow:var(--hoenn-shadow-control-hover)}}
@media (hover: hover){.x1d01od6.x1d01od6:hover:not(#\#):not(#\#){transform:translateY(-1px)}}
.x1t183r2:not(#\#):not(#\#):not(#\#){max-width:var(--hoenn-content-width)}
.xh8yej3:not(#\#):not(#\#):not(#\#){width:100%}
.xitzwig:not(#\#):not(#\#):not(#\#):not(#\#)::before{padding:5px 7px 4px}
.xh4sr3w:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{border-color:var(--hoenn-color-emerald-bright)}
.x17y2aii:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{border-radius:var(--hoenn-radius-compact)}
.x1fo1fc9:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{border-style:solid}
.xz8fyzm:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{border-width:1px}
.x140iz12:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{background-color:var(--hoenn-color-control-primary)}
.x1g5i5q9:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{color:var(--hoenn-color-on-control-primary)}
.x1j4kznz:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{content:'AREA'}
.x7j0ov6:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{font-size:24px}
.xlo8plg:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{font-weight:400}
.x41ot35:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{letter-spacing:0}
.xwro64b:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{line-height:1}
.xqz8civ:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before{text-transform:uppercase}