jaml-ui 0.24.20 → 0.25.2

package/dist/ui/jimbo.css

@@ -1,1856 +1,2 @@
-/* ═══════════════════════════════════════════════════════════════════════════
-   jimbo.css — Jimbo Design System
-   Balatro-inspired design tokens + component classes.
-   Eyedropped from actual game shader output — not Lua hex values.
-   ═══════════════════════════════════════════════════════════════════════════ */
-
-@font-face {
-  font-family: 'm6x11plus';
-  src: local('m6x11plus'), local('m6x11plusplus'),
-       url('../../assets/fonts/m6x11plusplus.otf') format('opentype');
-  font-weight: normal;
-  font-style: normal;
-  font-display: swap;
-}
-
-/* Global Scrollbar Hide */
-* {
-  scrollbar-width: none !important;
-  -ms-overflow-style: none !important;
-}
-
-*::-webkit-scrollbar {
-  display: none !important;
-}
-
-/* ── Design Tokens (CSS Custom Properties) ─────────────────────────────── */
-
-:root {
-  /* Colors — eyedropped from Balatro's rendered shader output */
-  --j-red: #fe5148;
-  --j-blue: #0093ff;
-  --j-green: #429f79;
-  --j-orange: #ff9800;
-  --j-gold: #e4b643;
-  --j-purple: #9e74ce;
-
-  --j-dark-red: #a02721;
-  --j-dark-blue: #0057a1;
-  --j-dark-orange: #a05b00;
-  --j-dark-green: #215f46;
-  --j-dark-purple: #5e437e;
-
-  --j-dark-grey: #3a5055;
-  --j-darkest: #1e2b2d;
-  --j-grey: #708386;
-  --j-teal-grey: #404c4e;
-
-  --j-panel-edge: #1e2e32;
-  --j-inner-border: #334461;
-  --j-border-silver: #b9c2d2;
-  --j-border-south: #777e89;
-
-  --j-gold-text: #e4b643;
-  --j-green-text: #35bd86;
-  --j-orange-text: #ff8f00;
-  --j-white: #ffffff;
-  --j-black: #000000;
-
-  --j-tarot-btn: #9e74ce;
-  --j-planet-btn: #00a7ca;
-  --j-spectral-btn: #2e76fd;
-  --j-tarot-btn-dark: #5e437e;
-  --j-planet-btn-dark: #00657c;
-  --j-spectral-btn-dark: #14449e;
-
-  /* Typography */
-  --j-font: 'm6x11plus', 'Courier New', monospace;
-  /* Coding font — used by JamlCodeEditor and .j-code-block. JetBrains Mono
-     with a long OS-native fallback chain so the UI still reads as code even
-     when the Google Fonts stylesheet fails to load. */
-  --j-font-code: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', 'SF Mono', SFMono-Regular, Menlo, Consolas, ui-monospace, 'Courier New', monospace;
-  --j-text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.8);
-
-  /* Spacing */
-  --j-space-xs: 2px;
-  --j-space-sm: 4px;
-  --j-space-md: 8px;
-  --j-space-lg: 12px;
-  --j-space-xl: 16px;
-
-  /* Radii — Balatro is chunky, not bubbly. Never > 10px. */
-  --j-radius-sm: 4px;
-  --j-radius-md: 6px;
-  --j-radius-lg: 8px;
-  --j-radius-pill: 10px;
-
-  /* Animation */
-  --j-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
-  --j-press-y: 3px;
-  --j-press-speed: 55ms;
-}
-
-
-/* ── Base Text ─────────────────────────────────────────────────────────── */
-
-.j-text {
-  font-family: var(--j-font);
-  font-weight: 400;
-  line-height: 1.2;
-  text-shadow: var(--j-text-shadow);
-  color: var(--j-white);
-}
-
-.j-text--no-shadow {
-  text-shadow: none;
-}
-
-.j-text--upper {
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-}
-
-/* Font Dance Animation */
-.j-text--dance-container {
-  display: inline-block;
-  white-space: pre-wrap;
-}
-
-.j-font-dance-char {
-  display: inline-block;
-  animation: j-font-dance 1.5s infinite steps(2, end);
-}
-
-@keyframes j-font-dance {
-
-  0%,
-  100% {
-    transform: translate(0, 0);
-  }
-
-  25% {
-    transform: translate(1px, -1px);
-  }
-
-  50% {
-    transform: translate(0, -2px);
-  }
-
-  75% {
-    transform: translate(-1px, -1px);
-  }
-}
-
-/* Sizes (from DESIGN.md typography scale) */
-.j-text--display {
-  font-size: 26px;
-  letter-spacing: 0.04em;
-  line-height: 1;
-}
-
-.j-text--xl {
-  font-size: 24px;
-  letter-spacing: 0.04em;
-}
-
-.j-text--lg {
-  font-size: 18px;
-  letter-spacing: 0.04em;
-}
-
-.j-text--heading {
-  font-size: 14px;
-  letter-spacing: 0.08em;
-  line-height: 1.2;
-}
-
-.j-text--md {
-  font-size: 14px;
-}
-
-.j-text--sm {
-  font-size: 12px;
-}
-
-.j-text--body {
-  font-size: 11px;
-  letter-spacing: 0.05em;
-  line-height: 1.3;
-}
-
-.j-text--xs {
-  font-size: 10px;
-}
-
-.j-text--label {
-  font-size: 9px;
-  letter-spacing: 0.1em;
-  line-height: 1;
-  text-transform: uppercase;
-}
-
-.j-text--micro {
-  font-size: 8px;
-  letter-spacing: 0.08em;
-  line-height: 1;
-}
-
-/* Tones */
-.j-text--default {
-  color: var(--j-white);
-}
-
-.j-text--mult,
-.j-text--red {
-  color: var(--j-red);
-}
-
-.j-text--chips,
-.j-text--blue {
-  color: var(--j-blue);
-}
-
-.j-text--gold {
-  color: var(--j-gold-text);
-}
-
-.j-text--green {
-  color: var(--j-green-text);
-}
-
-.j-text--orange {
-  color: var(--j-orange-text);
-}
-
-.j-text--purple {
-  color: var(--j-purple);
-}
-
-.j-text--grey {
-  color: var(--j-grey);
-}
-
-
-/* ── Panel ─────────────────────────────────────────────────────────────── */
-
-.j-panel {
-  background-color: var(--j-dark-grey);
-  border: 2px solid var(--j-border-silver);
-  border-bottom-color: var(--j-border-south);
-  border-radius: var(--j-radius-md);
-  box-shadow: 0 3px 0 0 rgba(0, 0, 0, 0.55),
-    inset 0 0 0 1px rgba(255, 255, 255, 0.04);
-  padding: var(--j-space-lg);
-  display: flex;
-  flex-direction: column;
-  align-items: stretch;
-  overflow: visible;
-  position: relative;
-}
-
-.j-panel__body {
-  flex: 1;
-  overflow: auto;
-}
-
-.j-panel__back {
-  margin-top: var(--j-space-lg);
-  padding-top: var(--j-space-md);
-  flex-shrink: 0;
-}
-
-.j-back-btn .j-btn__face {
-  padding-top: 8px;
-  padding-bottom: 8px;
-}
-
-.j-inner-panel {
-  background-color: var(--j-inner-border);
-  border: 2px solid var(--j-panel-edge);
-  border-radius: var(--j-radius-md);
-  padding: var(--j-space-lg);
-}
-
-
-/* ── Button ────────────────────────────────────────────────────────────── */
-/* Chunky 3D press: black underside via drop shadow,
-   press sinks the face +3px and collapses the shadow. */
-
-.j-btn {
-  appearance: none;
-  -webkit-appearance: none;
-  display: inline-block;
-  position: relative;
-  cursor: pointer;
-  border: none;
-  padding: 0;
-  background: transparent;
-  -webkit-user-select: none;
-  user-select: none;
-}
-
-/* Invisible stable hit target to prevent hover jitter when the child transforms */
-.j-btn::after {
-  content: '';
-  position: absolute;
-  inset: 0;
-  background: transparent;
-  z-index: 10;
-}
-
-.j-btn--full {
-  width: 100%;
-}
-
-.j-btn--disabled {
-  opacity: 0.55;
-  cursor: not-allowed;
-}
-
-.j-btn__face {
-  position: relative;
-  border-radius: var(--j-radius-md);
-  background: var(--j-btn-face-color, var(--j-orange));
-  text-align: center;
-  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.8);
-  box-shadow: 0 var(--j-press-y) 0 0 rgba(0, 0, 0, 0.6);
-  transform: translate(0, 0);
-  transition: transform var(--j-press-speed) linear, box-shadow var(--j-press-speed) linear;
-}
-
-.j-btn[data-pressed="true"] .j-btn__face,
-.j-btn:active:not(:disabled):not(.j-btn--disabled) .j-btn__face {
-  transform: translateY(var(--j-press-y));
-  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.6);
-}
-
-.j-btn:not(.j-btn--disabled):hover .j-btn__face {
-  background: var(--j-btn-hover-color, var(--j-btn-face-color));
-}
-
-/* Sizes */
-.j-btn--xs .j-btn__face {
-  padding: 4px 8px;
-  font-size: 11px;
-}
-
-.j-btn--sm .j-btn__face {
-  padding: 6px 12px;
-  font-size: 13px;
-}
-
-.j-btn--md .j-btn__face {
-  padding: 10px 18px;
-  font-size: 16px;
-}
-
-.j-btn--lg .j-btn__face {
-  padding: 8px 18px;
-  font-size: 20px;
-}
-
-/* Tone colors — set via CSS custom properties */
-.j-btn--orange {
-  --j-btn-face-color: var(--j-orange);
-  --j-btn-hover-color: var(--j-dark-orange);
-}
-
-.j-btn--red {
-  --j-btn-face-color: var(--j-red);
-  --j-btn-hover-color: var(--j-dark-red);
-}
-
-.j-btn--blue {
-  --j-btn-face-color: var(--j-blue);
-  --j-btn-hover-color: var(--j-dark-blue);
-}
-
-.j-btn--green {
-  --j-btn-face-color: var(--j-green);
-  --j-btn-hover-color: var(--j-dark-green);
-}
-
-.j-btn--tarot {
-  --j-btn-face-color: var(--j-tarot-btn);
-  --j-btn-hover-color: var(--j-tarot-btn-dark);
-}
-
-.j-btn--planet {
-  --j-btn-face-color: var(--j-planet-btn);
-  --j-btn-hover-color: var(--j-planet-btn-dark);
-}
-
-.j-btn--spectral {
-  --j-btn-face-color: var(--j-spectral-btn);
-  --j-btn-hover-color: var(--j-spectral-btn-dark);
-}
-
-
-/* ── Badge ─────────────────────────────────────────────────────────────── */
-
-.j-badge {
-  display: inline-flex;
-  align-items: center;
-  border-radius: var(--j-radius-sm);
-  font-family: var(--j-font);
-  font-weight: 400;
-  letter-spacing: 0.04em;
-  white-space: nowrap;
-  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.8);
-  border: none;
-}
-
-.j-badge--sm {
-  padding: 2px 6px;
-  font-size: 10px;
-}
-
-.j-badge--md {
-  padding: 4px 8px;
-  font-size: 12px;
-}
-
-/* Badge tones — flat, no shadow, no edges */
-.j-badge--dark {
-  background: var(--j-darkest);
-  color: var(--j-white);
-}
-
-.j-badge--blue {
-  background: var(--j-blue);
-  color: var(--j-white);
-}
-
-.j-badge--red {
-  background: var(--j-red);
-  color: var(--j-white);
-}
-
-.j-badge--green {
-  background: var(--j-green);
-  color: var(--j-white);
-}
-
-.j-badge--orange {
-  background: var(--j-orange);
-  color: var(--j-white);
-}
-
-.j-badge--purple {
-  background: var(--j-purple);
-  color: var(--j-white);
-}
-
-
-/* ── Tabs ──────────────────────────────────────────────────────────────── */
-
-.j-tabs {
-  display: flex;
-  gap: var(--j-space-sm);
-  align-items: flex-end;
-  justify-content: center;
-  flex-wrap: nowrap;
-  width: 100%;
-  overflow-x: auto;
-  scrollbar-width: none;
-}
-.j-tabs::-webkit-scrollbar { display: none; }
-
-.j-tab {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  position: relative;
-  flex: 0 0 auto;
-}
-
-.j-tab__indicator {
-  height: 10px;
-  margin-bottom: 3px;
-  display: flex;
-  justify-content: center;
-  align-items: flex-end;
-}
-
-.j-tab__indicator svg {
-  fill: var(--j-red);
-  display: block;
-}
-
-.j-tab__indicator[data-active="true"] {
-  animation: jimbo-bounce 0.7s ease-in-out infinite;
-}
-
-.j-tab__indicator[data-active="false"] {
-  visibility: hidden;
-}
-
-.j-tab__btn {
-  appearance: none;
-  -webkit-appearance: none;
-  border: none;
-  cursor: pointer;
-  border-radius: var(--j-radius-sm);
-  padding: 6px 14px;
-  min-height: 28px;
-  background: var(--j-red);
-  box-shadow: 0 3px 0 0 rgba(0, 0, 0, 0.6);
-  color: var(--j-white);
-  text-align: center;
-  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.8);
-  transition: background var(--j-press-speed) linear;
-  outline: none;
-}
-
-.j-tab__btn .j-text {
-  color: inherit;
-  text-shadow: inherit;
-}
-
-.j-tab__btn:hover {
-  background: var(--j-dark-red);
-}
-
-.j-tab__btn:active {
-  background: var(--j-dark-red);
-}
-
-
-@keyframes jimbo-bounce {
-  0% {
-    transform: translateY(0);
-    animation-timing-function: ease-out;
-  }
-  45% {
-    transform: translateY(-5px);
-    animation-timing-function: ease-in;
-  }
-  100% {
-    transform: translateY(0);
-  }
-}
-
-/* Vertical tabs */
-.j-vtabs {
-  display: flex;
-  flex-direction: column;
-  gap: var(--j-space-sm);
-}
-
-.j-vtab {
-  border: none;
-  cursor: pointer;
-  border-radius: 8px 0 0 8px;
-  padding: 16px 8px;
-  background-color: transparent;
-  writing-mode: vertical-rl;
-  text-orientation: mixed;
-  transform: rotate(180deg);
-  transition: none;
-}
-
-.j-vtab[data-active="true"] {
-  background-color: var(--j-gold, #e4b643);
-  color: var(--j-black, #000000);
-}
-
-
-/* ── Toggle List ──────────────────────────────────────────────────────── */
-
-.j-toggle-list {
-  display: flex;
-  flex-direction: column;
-  gap: var(--j-space-sm);
-}
-
-.j-toggle-list__title {
-  font-family: var(--j-font);
-  font-size: 12px;
-  color: var(--j-grey);
-  text-transform: uppercase;
-  letter-spacing: 0.04em;
-  margin-bottom: var(--j-space-sm);
-}
-
-.j-toggle-item {
-  display: flex;
-  align-items: center;
-  gap: var(--j-space-md);
-  padding: 6px 8px;
-  background: rgba(255, 255, 255, 0.05);
-  border: 1px solid rgba(0, 0, 0, 0.2);
-  border-radius: var(--j-radius-sm);
-  cursor: pointer;
-  font-family: var(--j-font);
-  color: var(--j-white);
-  text-transform: uppercase;
-  letter-spacing: 0.04em;
-  text-align: left;
-  justify-content: flex-start;
-}
-
-.j-toggle-check {
-  width: 10px;
-  height: 10px;
-  flex-shrink: 0;
-  border: 1px solid var(--j-dark-grey);
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5);
-}
-
-.j-toggle-check[data-on="true"] {
-  background: var(--j-orange);
-}
-
-.j-toggle-check[data-on="false"] {
-  background: var(--j-darkest);
-}
-
-
-/* ── Tooltip ──────────────────────────────────────────────────────────── */
-
-.j-tooltip {
-  position: fixed;
-  max-width: 280px;
-  padding: 6px 10px;
-  border-radius: var(--j-radius-md);
-  background: var(--j-darkest);
-  border: 2px solid var(--j-border-silver);
-  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.8);
-  color: var(--j-white);
-  pointer-events: none;
-  z-index: 9999;
-  transition: opacity 120ms ease;
-}
-
-
-
-/* ── Layout Utilities ─────────────────────────────────────────────────── */
-
-.j-flex {
-  display: flex;
-}
-
-.j-flex-col {
-  display: flex;
-  flex-direction: column;
-}
-
-.j-items-center {
-  align-items: center;
-}
-
-.j-items-start {
-  align-items: flex-start;
-}
-
-.j-justify-center {
-  justify-content: center;
-}
-
-.j-justify-between {
-  justify-content: space-between;
-}
-
-.j-gap-xs { gap: var(--j-space-xs); }
-.j-gap-sm { gap: var(--j-space-sm); }
-.j-gap-md { gap: var(--j-space-md); }
-.j-gap-lg { gap: var(--j-space-lg); }
-
-.j-w-full { width: 100%; }
-.j-h-full { height: 100%; }
-
-.j-text-center { text-align: center; }
-
-
-/* ── Flank Nav ────────────────────────────────────────────────────────── */
-
-.j-flank {
-  display: flex;
-  align-items: stretch;
-  justify-content: center;
-  gap: var(--j-space-md);
-  width: 100%;
-  position: relative;
-}
-
-.j-flank__content {
-  position: relative;
-  flex: 1;
-  min-width: 0;
-  display: flex;
-  flex-direction: column;
-}
-
-.j-flank__btn {
-  flex-shrink: 0;
-  width: 40px;
-  margin: var(--j-press-y) 0;
-  border: none;
-  border-radius: var(--j-radius-lg);
-  cursor: pointer;
-  background-color: var(--j-red);
-  color: var(--j-white);
-  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.8);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  box-shadow: 0 var(--j-press-y) 0 0 var(--j-dark-red);
-  transition: transform var(--j-press-speed) ease,
-    box-shadow var(--j-press-speed) ease,
-    background-color var(--j-press-speed) ease;
-}
-
-.j-flank__btn[data-pressed="true"] {
-  transform: translateY(var(--j-press-y));
-  box-shadow: none;
-}
-
-.j-flank__btn:disabled {
-  background-color: var(--j-dark-red);
-  cursor: default;
-  box-shadow: none;
-}
-
-
-/* ── Copy Row ─────────────────────────────────────────────────────────── */
-
-.j-copy-row {
-  display: flex;
-  flex-direction: column;
-  gap: var(--j-space-sm);
-}
-
-.j-copy-row__field {
-  display: flex;
-  align-items: center;
-  gap: var(--j-space-md);
-}
-
-.j-copy-row__value {
-  flex: 1;
-  padding: 6px 10px;
-  background: var(--j-darkest);
-  border: 2px solid var(--j-panel-edge);
-  border-radius: var(--j-radius-sm);
-  word-break: break-all;
-}
-
-.j-copy-row__btn {
-  font-family: var(--j-font);
-  font-size: 11px;
-  letter-spacing: 0.08em;
-  border-radius: var(--j-radius-sm);
-  padding: 4px 12px;
-  cursor: pointer;
-  flex-shrink: 0;
-  transition: color 0.15s, background 0.15s, border-color 0.15s;
-}
-
-.j-copy-row__btn[data-copied="false"] {
-  color: var(--j-gold-text);
-  background: rgba(228, 182, 67, 0.12);
-  border: 1px solid var(--j-gold-text);
-}
-
-.j-copy-row__btn[data-copied="true"] {
-  color: var(--j-green-text);
-  background: rgba(53, 189, 134, 0.12);
-  border: 1px solid var(--j-green-text);
-}
-
-
-/* ── Code Block ───────────────────────────────────────────────────────── */
-
-.j-code-block {
-  background-color: var(--j-darkest);
-  border: 2px solid var(--j-panel-edge);
-  border-radius: var(--j-radius-lg);
-  box-shadow: 0 3px 0 0 rgba(0, 0, 0, 0.5);
-  overflow: hidden;
-  display: flex;
-  flex-direction: column;
-}
-
-.j-code-block__header {
-  padding: 8px 12px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  border-bottom: 1px solid var(--j-inner-border);
-}
-
-.j-code-block__meta {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-}
-
-.j-code-block__filename {
-  font-size: 10px;
-  opacity: 0.6;
-}
-
-.j-code-block__lang {
-  font-size: 9px;
-  padding: 1px 6px;
-  border-radius: 3px;
-  background: rgba(0, 0, 0, 0.4);
-  color: #60a5fa;
-}
-
-.j-code-block__copy {
-  padding: 4px;
-  background: none;
-  border: none;
-  cursor: pointer;
-  display: flex;
-}
-
-.j-code-block__copy[data-copied="false"] {
-  color: rgba(255, 255, 255, 0.5);
-}
-
-.j-code-block__copy[data-copied="true"] {
-  color: #4ade80;
-}
-
-.j-code-block__pre {
-  padding: 12px;
-  overflow-x: auto;
-  font-family: var(--j-font-code);
-  font-size: 0.875rem;
-  line-height: 1.6;
-  color: #f6f0d5;
-  margin: 0;
-}
-
-
-/* ── Filter Bar ───────────────────────────────────────────────────────── */
-
-.j-filter-bar {
-  display: flex;
-  gap: 24px;
-  padding: var(--j-space-xl);
-  background-color: var(--j-dark-grey);
-  border: 4px solid var(--j-border-silver);
-  box-shadow: 0 3px 0 0 var(--j-border-south);
-  border-radius: var(--j-radius-lg);
-  position: relative;
-  flex-wrap: wrap;
-}
-
-.j-filter-bar__field {
-  flex: 1;
-  min-width: 200px;
-  position: relative;
-  margin-top: 10px;
-}
-
-.j-filter-bar__pill {
-  position: absolute;
-  top: -14px;
-  left: 16px;
-  background-color: var(--j-red);
-  border: 2px solid var(--j-dark-red);
-  border-radius: var(--j-radius-md);
-  padding: 4px 12px;
-  z-index: 2;
-}
-
-.j-filter-bar__input {
-  width: 100%;
-  padding: 14px 16px 14px 48px;
-  background-color: var(--j-darkest);
-  border: none;
-  border-bottom: 4px solid var(--j-panel-edge);
-  border-radius: var(--j-radius-lg);
-  color: var(--j-white);
-  font-family: var(--j-font);
-  font-size: 20px;
-  letter-spacing: 0.08em;
-  outline: none;
-}
-
-.j-filter-bar__search-icon {
-  position: absolute;
-  left: 0;
-  top: 0;
-  bottom: 0;
-  width: 48px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  pointer-events: none;
-  color: var(--j-blue);
-  z-index: 1;
-}
-
-.j-filter-bar__select {
-  appearance: none;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  background-color: var(--j-orange);
-  color: var(--j-white);
-  border: none;
-  border-bottom: 4px solid var(--j-dark-orange);
-  border-radius: var(--j-radius-lg);
-  cursor: pointer;
-  font-family: var(--j-font);
-  font-size: 18px;
-  letter-spacing: 0.08em;
-  padding: 14px 48px 14px 24px;
-  min-width: 200px;
-  text-align: center;
-  outline: none;
-}
-
-.j-filter-bar__sort-icon {
-  position: absolute;
-  right: 16px;
-  top: 50%;
-  transform: translateY(-50%);
-  pointer-events: none;
-  color: var(--j-white);
-  opacity: 0.85;
-}
-
-/* ── FlankNav ───────────────────────────────────────────────────────────── */
-
-.j-flank {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  gap: var(--j-space-md);
-  width: 100%;
-}
-
-.j-flank__content {
-  flex: 1;
-  display: flex;
-  justify-content: center;
-}
-
-.j-flank__btn {
-  background: var(--j-red);
-  color: var(--j-white);
-  border: none;
-  border-radius: var(--j-radius-sm);
-  padding: var(--j-space-sm) var(--j-space-xs);
-  cursor: pointer;
-  box-shadow: 0 var(--j-press-y) 0 var(--j-dark-grey);
-  transition: transform 0.05s ease, box-shadow 0.05s ease, opacity 0.2s ease;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.j-flank__btn[data-pressed="true"] {
-  transform: translateY(var(--j-press-y));
-  box-shadow: 0 0 0 var(--j-dark-grey);
-}
-
-.j-flank__btn:disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-  transform: none;
-  box-shadow: 0 var(--j-press-y) 0 var(--j-dark-grey);
-}
-
-
-/* ── Modal ────────────────────────────────────────────────────────────── */
-
-@keyframes jimbo-modal-in {
-  from { transform: scale(0.88); opacity: 0; }
-  to   { transform: scale(1);    opacity: 1; }
-}
-
-.j-modal-overlay {
-  position: absolute;
-  inset: 0;
-  z-index: 1000;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: var(--j-space-md);
-  background: rgba(0, 0, 0, 0.82);
-}
-
-.j-modal {
-  width: 100%;
-  max-width: 345px;
-  max-height: calc(100% - 32px);
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  border-radius: 12px;
-  animation: jimbo-modal-in 140ms cubic-bezier(0.2, 0, 0.2, 1.4) both;
-}
-
-.j-modal .j-panel__body {
-  overflow-y: auto;
-  min-height: 0;
-}
-
-.j-modal__title {
-  text-align: center;
-  margin: 0 0 var(--j-space-xl);
-  flex-shrink: 0;
-}
-
-
-/* ── Footer ───────────────────────────────────────────────────────────── */
-
-.j-footer {
-  position: fixed;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  z-index: 100;
-  transition: opacity 200ms;
-}
-
-.j-footer--hidden {
-  pointer-events: none;
-  opacity: 0;
-}
-
-.j-footer__bar {
-  width: 100%;
-  border-top: 1px solid rgba(255, 255, 255, 0.1);
-  background: rgba(0, 0, 0, 0.9);
-  padding: 0 1rem 3px;
-  text-align: center;
-}
-
-.j-footer__text {
-  font-family: var(--j-font);
-  font-size: clamp(11px, 0.8vw + 8px, 14px);
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  justify-content: center;
-  gap: 0 0.5rem;
-  color: white;
-  margin: 0;
-}
-
-.j-footer__link {
-  color: var(--j-gold);
-  text-decoration: none;
-}
-
-
-/* ── Floating ─────────────────────────────────────────────────────────── */
-
-.j-floating {
-  position: absolute;
-  z-index: 20;
-}
-
-
-/* ── Background (canvas is styled inline because it's fixed fullscreen) ── */
-
-
-/* ── GlowRing ─────────────────────────────────────────────────────────── */
-
-.j-glow--must {
-  box-shadow: 0 0 0 2px var(--j-blue), 0 0 10px var(--j-blue);
-  animation: j-glow-pulse 1.6s ease-in-out infinite;
-}
-
-.j-glow--should {
-  box-shadow: 0 0 0 2px var(--j-gold), 0 0 10px var(--j-gold);
-  animation: j-glow-pulse 1.6s ease-in-out infinite;
-}
-
-@keyframes j-glow-pulse {
-
-  0%,
-  100% {
-    opacity: 0.55;
-  }
-
-  50% {
-    opacity: 1;
-  }
-}
-
-
-/* ── Utility ──────────────────────────────────────────────────────────── */
-
-.j-flex {
-  display: flex;
-}
-
-.j-flex-col {
-  display: flex;
-  flex-direction: column;
-}
-
-.j-flex-wrap {
-  flex-wrap: wrap;
-}
-
-.j-items-center {
-  align-items: center;
-}
-
-.j-justify-center {
-  justify-content: center;
-}
-
-.j-gap-xs {
-  gap: var(--j-space-xs);
-}
-
-.j-gap-sm {
-  gap: var(--j-space-sm);
-}
-
-.j-gap-md {
-  gap: var(--j-space-md);
-}
-
-.j-gap-lg {
-  gap: var(--j-space-lg);
-}
-
-.j-gap-xl {
-  gap: var(--j-space-xl);
-}
-
-.j-w-full {
-  width: 100%;
-}
-
-.j-shrink-0 {
-  flex-shrink: 0;
-}
-
-.j-flex-1 {
-  flex: 1;
-}
-
-.j-min-w-0 {
-  min-width: 0;
-}
-
-.j-text-center {
-  text-align: center;
-}
-
-.j-overflow-hidden {
-  overflow: hidden;
-}
-
-.j-overflow-auto {
-  overflow: auto;
-}
-
-.j-relative {
-  position: relative;
-}
-
-/* Tone border utilities */
-.j-border--red {
-  border-color: var(--j-red);
-}
-
-.j-border--blue {
-  border-color: var(--j-blue);
-}
-
-.j-border--green {
-  border-color: var(--j-green);
-}
-
-.j-border--gold {
-  border-color: var(--j-gold);
-}
-
-.j-border--orange {
-  border-color: var(--j-orange);
-}
-
-.j-border--purple {
-  border-color: var(--j-purple);
-}
-
-/* Tone background utilities */
-.j-bg--red {
-  background-color: var(--j-red);
-}
-
-.j-bg--blue {
-  background-color: var(--j-blue);
-}
-
-.j-bg--green {
-  background-color: var(--j-green);
-}
-
-.j-bg--gold {
-  background-color: var(--j-gold);
-}
-
-.j-bg--orange {
-  background-color: var(--j-orange);
-}
-
-.j-bg--purple {
-  background-color: var(--j-purple);
-}
-
-.j-bg--dark-grey {
-  background-color: var(--j-dark-grey);
-}
-
-.j-bg--darkest {
-  background-color: var(--j-darkest);
-}
-
-/* ── App Shell ────────────────────────────────────────────────────────── */
-/* Mobile-first 320px layout container for ALL Jimbo UI screens.
- * Supports container queries for responsive breakpoints:
- *   compact  ≤400px  — iPhone SE, fixed 568px height, NO scroll
- *   cozy     401-750px — MCP inline / wider phones, flexible height, scroll OK
- *   wide     751px+  — tablet/desktop, two-column layouts (future)
- *
- * Default = compact (hard lock). Add .j-app--fluid to unlock for MCP/desktop.
- */
-
-.j-app {
-  container-type: inline-size;
-  container-name: jimbo;
-  width: 375px;
-  max-width: 375px;
-  height: 667px;
-  max-height: 667px;
-  margin: 0 auto;
-  display: flex;
-  flex-direction: column;
-  background: var(--j-darkest);
-  font-family: var(--j-font);
-  color: var(--j-white);
-  overflow: hidden;
-  position: relative;
-}
-
-/* Fluid modifier — unlocks the container for MCP / desktop contexts. */
-.j-app--fluid {
-  width: 100%;
-  max-width: 750px;
-  height: auto;
-  max-height: none;
-  min-height: 400px;
-}
-
-.j-app__content {
-  flex: 1;
-  min-height: 0;
-  overflow: hidden;
-  padding: var(--j-space-lg) var(--j-space-lg) var(--j-space-md);
-  display: flex;
-  flex-direction: column;
-}
-
-.j-app__scroll {
-  flex: 1;
-  min-height: 0;
-  overflow-y: auto;
-  overflow-x: hidden;
-  padding: var(--j-space-lg) var(--j-space-lg) var(--j-space-md);
-  scrollbar-width: none;
-  -ms-overflow-style: none;
-  scroll-snap-type: y mandatory;
-}
-
-.j-app__scroll > * {
-  scroll-snap-align: start;
-}
-
-.j-app__scroll::-webkit-scrollbar {
-  display: none;
-}
-
-.j-app__footer {
-  flex-shrink: 0;
-  padding: var(--j-space-md) var(--j-space-lg) var(--j-space-md);
-  border-top: 2px solid var(--j-black);
-  background: var(--j-dark-grey);
-  display: flex;
-  flex-direction: column;
-  gap: var(--j-space-sm);
-}
-
-/* ── Cozy Breakpoint (401px+) ──────────────────────────────────────── */
-/* Only activates when j-app--fluid is used AND container is wide enough. */
-
-@container jimbo (min-width: 401px) {
-  .j-app__content {
-    padding: var(--j-space-xl) var(--j-space-xl) var(--j-space-lg);
-  }
-
-  .j-app__scroll {
-    padding: var(--j-space-xl) var(--j-space-xl) var(--j-space-lg);
-  }
-
-  .j-app__footer {
-    padding: var(--j-space-md) var(--j-space-xl) var(--j-space-lg);
-  }
-}
-
-@container jimbo (min-width: 401px) {
-  .j-stat-grid__value {
-    font-size: 20px;
-  }
-
-  .j-info-card {
-    padding: var(--j-space-md) var(--j-space-lg);
-  }
-
-  .j-info-card__title {
-    font-size: 14px;
-  }
-
-  .j-section-header__tag {
-    font-size: 12px;
-  }
-}
-
-
-/* ── Section Header ──────────────────────────────────────────────────── */
-/* Colored tag + horizontal rule — reusable section divider. */
-
-.j-section-header {
-  display: flex;
-  align-items: center;
-  gap: var(--j-space-md);
-  margin-bottom: var(--j-space-md);
-}
-
-.j-section-header__tag {
-  font-family: var(--j-font);
-  font-size: 11px;
-  letter-spacing: 2px;
-  padding: 2px 8px;
-  color: var(--j-white);
-  border-radius: 3px;
-  text-shadow: var(--j-text-shadow);
-  flex-shrink: 0;
-}
-
-.j-section-header__rule {
-  flex: 1;
-  height: 2px;
-  border-radius: 1px;
-  opacity: 0.33;
-}
-
-
-/* ── Stat Grid ───────────────────────────────────────────────────────── */
-/* 3-column stat bar — reusable primitive. */
-
-.j-stat-grid {
-  background: var(--j-dark-grey);
-  border-radius: var(--j-radius-md);
-  padding: var(--j-space-md);
-  border: 2px solid var(--j-panel-edge);
-  box-shadow: 0 2px 0 var(--j-black);
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
-  gap: var(--j-space-md);
-  text-align: center;
-}
-
-.j-stat-grid__value {
-  font-family: var(--j-font);
-  font-size: 16px;
-  color: var(--j-gold-text);
-  text-shadow: var(--j-text-shadow);
-}
-
-.j-stat-grid__label {
-  font-family: var(--j-font);
-  font-size: 9px;
-  color: var(--j-grey);
-  letter-spacing: 2px;
-  margin-top: 2px;
-}
-
-
-/* ── Info Card ───────────────────────────────────────────────────────── */
-/* Generic clickable row card — used for filter lists, seed lists, etc. */
-
-.j-info-card {
-  background: var(--j-dark-grey);
-  border-radius: var(--j-radius-md);
-  padding: var(--j-space-md);
-  box-shadow: 0 2px 0 var(--j-black);
-  display: flex;
-  align-items: center;
-  gap: var(--j-space-md);
-  cursor: pointer;
-  border: 2px solid transparent;
-}
-
-.j-info-card:hover {
-  filter: brightness(1.08);
-}
-
-.j-info-card__body {
-  flex: 1;
-  min-width: 0;
-}
-
-.j-info-card__title {
-  font-family: var(--j-font);
-  font-size: 13px;
-  color: var(--j-white);
-  letter-spacing: 1px;
-  text-shadow: var(--j-text-shadow);
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.j-info-card__sub {
-  font-family: var(--j-font);
-  font-size: 9px;
-  color: var(--j-gold-text);
-  letter-spacing: 1px;
-  margin-top: 2px;
-}
-
-.j-info-card__aside {
-  text-align: right;
-  flex-shrink: 0;
-}
-
-
-/* ── Inset Box ───────────────────────────────────────────────────────── */
-/* Dark recessed content area — for log output, recent finds, etc. */
-
-.j-inset {
-  background: var(--j-dark-grey);
-  border-radius: var(--j-radius-md);
-  padding: var(--j-space-md) var(--j-space-md);
-  border: 2px solid var(--j-panel-edge);
-  box-shadow: 0 2px 0 var(--j-black);
-  font-family: var(--j-font);
-  font-size: 11px;
-  color: var(--j-grey);
-  letter-spacing: 1px;
-  line-height: 1.7;
-}
-
-
-/* ── Wordmark ────────────────────────────────────────────────────────── */
-/* Title + subtitle hero block. */
-
-.j-wordmark {
-  text-align: center;
-  margin-bottom: var(--j-space-xl);
-}
-
-.j-wordmark__title {
-  font-family: var(--j-font);
-  font-size: 32px;
-  letter-spacing: 3px;
-  line-height: 1;
-  color: var(--j-gold-text);
-  text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.8);
-}
-
-.j-wordmark__sub {
-  font-family: var(--j-font);
-  font-size: 14px;
-  letter-spacing: 4px;
-  color: var(--j-grey);
-  margin-top: 4px;
-  text-shadow: var(--j-text-shadow);
-}
-
-
-/* ── Seed Input ───────────────────────────────────────────────────────── */
-
-.j-seed-input {
-  display: flex;
-  flex-direction: column;
-  gap: var(--j-space-sm);
-}
-
-.j-seed-input__field {
-  width: 100%;
-  padding: 8px 12px;
-  border-radius: var(--j-radius-md);
-  border: 2px solid var(--j-panel-edge);
-  background: var(--j-darkest);
-  color: var(--j-gold-text);
-  font-size: 18px;
-  font-family: var(--j-font);
-  font-weight: 400;
-  letter-spacing: 0.12em;
-  text-transform: uppercase;
-  text-shadow: var(--j-text-shadow);
-  outline: none;
-  transition: border-color 100ms ease;
-  box-sizing: border-box;
-}
-
-.j-seed-input__field::placeholder {
-  color: var(--j-grey);
-  opacity: 0.6;
-  text-transform: uppercase;
-  letter-spacing: 0.06em;
-  font-size: 12px;
-}
-
-.j-seed-input__field:focus {
-  border-color: var(--j-gold);
-}
-
-.j-seed-input__field[data-valid="true"] {
-  border-color: var(--j-green);
-}
-
-.j-seed-input__field[data-valid="false"] {
-  border-color: var(--j-red);
-}
-
-.j-seed-input__field[data-valid="partial"] {
-  border-color: var(--j-panel-edge);
-}
-
-.j-seed-input__hint {
-  font-family: var(--j-font);
-  font-size: 9px;
-  letter-spacing: 0.08em;
-  color: var(--j-grey);
-  text-shadow: var(--j-text-shadow);
-}
-
-
-/* ── Aesthetic Selector ──────────────────────────────────────────────── */
-
-.j-aesthetic-selector {
-  display: flex;
-  flex-direction: column;
-  gap: var(--j-space-sm);
-}
-
-.j-aesthetic-selector__list {
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--j-space-sm);
-}
-
-.j-aesthetic-pill {
-  padding: 4px 10px;
-  border-radius: var(--j-radius-md);
-  border: 2px solid var(--j-panel-edge);
-  background: var(--j-darkest);
-  color: var(--j-grey);
-  cursor: pointer;
-  font-size: 11px;
-  font-family: var(--j-font);
-  font-weight: 400;
-  letter-spacing: 0.04em;
-  text-shadow: var(--j-text-shadow);
-  transition: border-color 100ms ease, background 100ms ease, color 100ms ease;
-  box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.3);
-}
-
-.j-aesthetic-pill:hover {
-  border-color: var(--j-gold);
-  color: var(--j-gold-text);
-}
-
-.j-aesthetic-pill[data-active="true"] {
-  border-color: var(--j-gold);
-  background: rgba(228, 182, 67, 0.13);
-  color: var(--j-gold-text);
-  box-shadow: 0 0 0 1px var(--j-gold), 0 2px 0 0 rgba(0, 0, 0, 0.3);
-}
-
-
-/* ── Showcase ─────────────────────────────────────────────────────────── */
-
-.j-showcase {
-  width: 100%;
-  height: 100%;
-  background: var(--j-darkest);
-  display: flex;
-  flex-direction: column;
-  font-family: var(--j-font);
-  color: var(--j-white);
-  overflow: hidden;
-}
-
-.j-showcase__scroll {
-  flex: 1;
-  min-height: 0;
-  overflow-y: auto;
-  padding: 18px 14px 10px;
-}
-
-.j-showcase__wordmark {
-  text-align: center;
-  margin-bottom: 18px;
-}
-
-.j-showcase__wordmark-title {
-  font-size: 32px;
-  letter-spacing: 3px;
-  line-height: 1;
-  color: var(--j-gold-text);
-  text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.8);
-}
-
-.j-showcase__wordmark-sub {
-  font-size: 14px;
-  letter-spacing: 4px;
-  color: var(--j-grey);
-  margin-top: 4px;
-  text-shadow: var(--j-text-shadow);
-}
-
-.j-showcase__stats {
-  background: var(--j-dark-grey);
-  border-radius: var(--j-radius-md);
-  padding: 10px;
-  border: 2px solid var(--j-panel-edge);
-  box-shadow: 0 2px 0 var(--j-black);
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
-  gap: var(--j-space-md);
-  text-align: center;
-  margin-bottom: var(--j-space-xl);
-}
-
-.j-showcase__stat-value {
-  font-size: 16px;
-  color: var(--j-gold-text);
-  text-shadow: var(--j-text-shadow);
-}
-
-.j-showcase__stat-label {
-  font-size: 9px;
-  color: var(--j-grey);
-  letter-spacing: 2px;
-  margin-top: 2px;
-}
-
-.j-showcase__section-header {
-  display: flex;
-  align-items: center;
-  gap: var(--j-space-md);
-  margin-bottom: var(--j-space-md);
-}
-
-.j-showcase__section-tag {
-  font-size: 11px;
-  letter-spacing: 2px;
-  padding: 2px 8px;
-  color: var(--j-white);
-  border-radius: 3px;
-  text-shadow: var(--j-text-shadow);
-}
-
-.j-showcase__section-rule {
-  flex: 1;
-  height: 2px;
-  border-radius: 1px;
-}
-
-.j-showcase__filter-list {
-  display: flex;
-  flex-direction: column;
-  gap: var(--j-space-md);
-  margin-bottom: var(--j-space-xl);
-}
-
-.j-showcase__filter-card {
-  background: var(--j-dark-grey);
-  border-radius: var(--j-radius-md);
-  padding: 10px;
-  box-shadow: 0 2px 0 var(--j-black);
-  display: flex;
-  align-items: center;
-  gap: 10px;
-  cursor: pointer;
-}
-
-.j-showcase__filter-sprites {
-  display: flex;
-  gap: 2px;
-}
-
-.j-showcase__filter-sprite {
-  width: 30px;
-  height: 40px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.j-showcase__filter-info {
-  flex: 1;
-  min-width: 0;
-}
-
-.j-showcase__filter-name {
-  font-size: 13px;
-  color: var(--j-white);
-  letter-spacing: 1px;
-  text-shadow: var(--j-text-shadow);
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.j-showcase__filter-author {
-  font-size: 9px;
-  color: var(--j-gold-text);
-  letter-spacing: 1px;
-  margin-top: 2px;
-}
-
-.j-showcase__filter-hits {
-  text-align: right;
-}
-
-.j-showcase__filter-hits-value {
-  font-size: 14px;
-  text-shadow: var(--j-text-shadow);
-}
-
-.j-showcase__filter-hits-label {
-  font-size: 8px;
-  color: var(--j-grey);
-  letter-spacing: 1px;
-}
-
-.j-showcase__recent {
-  background: var(--j-dark-grey);
-  border-radius: var(--j-radius-md);
-  padding: 8px 10px;
-  border: 2px solid var(--j-panel-edge);
-  box-shadow: 0 2px 0 var(--j-black);
-  font-size: 11px;
-  color: var(--j-grey);
-  letter-spacing: 1px;
-  line-height: 1.7;
-}
-
-.j-showcase__actions {
-  padding: 8px 10px 10px;
-  border-top: 2px solid var(--j-black);
-  background: var(--j-dark-grey);
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
-
-
-/* ── Footer suit animation ────────────────────────────────────────────── */
-
-.j-footer__suits {
-  display: inline-flex;
-  align-items: center;
-}
-
-.j-footer__suit-stage {
-  position: relative;
-  display: inline-block;
-  width: 1.5em;
-  height: 1em;
-  vertical-align: middle;
-}
-
-.j-footer__suit-char {
-  position: absolute;
-  inset: 0;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  opacity: 0;
-  animation-duration: 5s;
-  animation-delay: 0s;
-  animation-iteration-count: infinite;
-  animation-timing-function: ease-out;
-}
-
-
-/* ── Copy row label ───────────────────────────────────────────────────── */
-
-.j-copy-row__label {
-  letter-spacing: 2px;
-}
-
-
-/* ── Motely version badge ─────────────────────────────────────────────── */
-
-.j-motely-badge {
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-}
-
-.j-motely-badge--chip {
-  padding: 3px 8px;
-  border-radius: var(--j-radius-sm);
-  background: var(--j-darkest);
-  border: 1px solid var(--j-panel-edge);
-}
-
-/* ── Font Dance Animation ─────────────────────────────────────────────── */
-
-@keyframes j-font-dance {
-  0% {
-    transform: translateY(0);
-  }
-
-  25% {
-    transform: translateY(-1px);
-  }
-
-  50% {
-    transform: translateY(0);
-  }
-
-  75% {
-    transform: translateY(1px);
-  }
-
-  100% {
-    transform: translateY(0);
-  }
-}
-
-.j-text--dance-container {
-  display: inline-flex;
-}
-
-.j-font-dance-char {
-  display: inline-block;
-  animation: j-font-dance 3s infinite ease-in-out;
-}
-
-.hide-scrollbar {
-  scrollbar-width: none;
-  -ms-overflow-style: none;
-}
-
-.hide-scrollbar::-webkit-scrollbar {
-  display: none;
-}
-
-.j-juice-hover {
-  transition: transform 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
-}
-
-.j-juice-hover:hover {
-  transform: scale(1.05) translateY(-2px);
-  z-index: 5;
-}
+@font-face{font-family:m6x11plus;src:url(/fonts/m6x11plus.otf)format("opentype");font-weight:400;font-style:normal;font-display:swap}*{scrollbar-width:none!important;-ms-overflow-style:none!important}::-webkit-scrollbar{display:none!important}:root{--j-red:#fe5148;--j-blue:#0093ff;--j-green:#429f79;--j-orange:#ff9800;--j-gold:#e4b643;--j-purple:#9e74ce;--j-dark-red:#a02721;--j-dark-blue:#0057a1;--j-dark-orange:#a05b00;--j-dark-green:#215f46;--j-dark-purple:#5e437e;--j-dark-grey:#3a5055;--j-darkest:#1e2b2d;--j-grey:#708386;--j-teal-grey:#404c4e;--j-panel-edge:#1e2e32;--j-inner-border:#334461;--j-border-silver:#b9c2d2;--j-border-south:#777e89;--j-gold-text:#e4b643;--j-green-text:#35bd86;--j-orange-text:#ff8f00;--j-white:#fff;--j-black:#000;--j-tarot-btn:#9e74ce;--j-planet-btn:#00a7ca;--j-spectral-btn:#2e76fd;--j-tarot-btn-dark:#5e437e;--j-planet-btn-dark:#00657c;--j-spectral-btn-dark:#14449e;--j-font:"m6x11plus", "Courier New", monospace;--j-font-code:"JetBrains Mono", "Cascadia Code", "Fira Code", "SF Mono", SFMono-Regular, Menlo, Consolas, ui-monospace, "Courier New", monospace;--j-text-shadow:1px 1px 0 #000c;--j-space-xs:2px;--j-space-sm:4px;--j-space-md:8px;--j-space-lg:12px;--j-space-xl:16px;--j-radius-sm:4px;--j-radius-md:6px;--j-radius-lg:8px;--j-radius-pill:10px;--j-ease-bounce:cubic-bezier(.34, 1.56, .64, 1);--j-press-y:3px;--j-press-speed:55ms}.j-text{font-family:var(--j-font);text-shadow:var(--j-text-shadow);color:var(--j-white);font-weight:400;line-height:1.2}.j-text--no-shadow{text-shadow:none}.j-text--upper{text-transform:uppercase;letter-spacing:.08em}.j-text--dance-container{white-space:pre-wrap;display:inline-block}@keyframes j-font-dance{0%{transform:translateY(0)}25%{transform:translateY(-1px)}50%{transform:translateY(0)}75%{transform:translateY(1px)}to{transform:translateY(0)}}.j-text--display{letter-spacing:.04em;font-size:26px;line-height:1}.j-text--xl{letter-spacing:.04em;font-size:24px}.j-text--lg{letter-spacing:.04em;font-size:18px}.j-text--heading{letter-spacing:.08em;font-size:14px;line-height:1.2}.j-text--md{font-size:14px}.j-text--sm{font-size:12px}.j-text--body{letter-spacing:.05em;font-size:11px;line-height:1.3}.j-text--xs{font-size:10px}.j-text--label{letter-spacing:.1em;text-transform:uppercase;font-size:9px;line-height:1}.j-text--micro{letter-spacing:.08em;font-size:8px;line-height:1}.j-text--default{color:var(--j-white)}.j-text--mult,.j-text--red{color:var(--j-red)}.j-text--chips,.j-text--blue{color:var(--j-blue)}.j-text--gold{color:var(--j-gold-text)}.j-text--green{color:var(--j-green-text)}.j-text--orange{color:var(--j-orange-text)}.j-text--purple{color:var(--j-purple)}.j-text--grey{color:var(--j-grey)}.j-panel{background-color:var(--j-dark-grey);border:2px solid var(--j-border-silver);border-bottom-color:var(--j-border-south);border-radius:var(--j-radius-md);padding:var(--j-space-lg);flex-direction:column;align-items:stretch;display:flex;position:relative;overflow:visible;box-shadow:0 3px #0000008c,inset 0 0 0 1px #ffffff0a}.j-panel__body{flex:1;overflow:auto}.j-panel__back{margin-top:var(--j-space-lg);padding-top:var(--j-space-md);flex-shrink:0}.j-back-btn .j-btn__face{padding-top:8px;padding-bottom:8px}.j-inner-panel{background-color:var(--j-inner-border);border:2px solid var(--j-panel-edge);border-radius:var(--j-radius-md);padding:var(--j-space-lg)}.j-btn{appearance:none;cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;border:none;padding:0;display:inline-block;position:relative}.j-btn:after{content:"";z-index:10;background:0 0;position:absolute;inset:0}.j-btn--full{width:100%}.j-btn--disabled{opacity:.55;cursor:not-allowed}.j-btn__face{border-radius:var(--j-radius-md);background:var(--j-btn-face-color,var(--j-orange));text-align:center;text-shadow:1px 1px #000c;box-shadow:0 var(--j-press-y) 0 0 #0009;transition:transform var(--j-press-speed) linear, box-shadow var(--j-press-speed) linear;position:relative;transform:translate(0)}.j-btn[data-pressed=true] .j-btn__face,.j-btn:active:not(:disabled):not(.j-btn--disabled) .j-btn__face{transform:translateY(var(--j-press-y));box-shadow:0 0 #0009}.j-btn:not(.j-btn--disabled):hover .j-btn__face{filter:brightness(1.1)}.j-btn--xs .j-btn__face{padding:4px 8px;font-size:11px}.j-btn--sm .j-btn__face{padding:6px 12px;font-size:13px}.j-btn--md .j-btn__face{padding:10px 18px;font-size:16px}.j-btn--lg .j-btn__face{padding:8px 18px;font-size:20px}.j-btn--orange{--j-btn-face-color:var(--j-orange)}.j-btn--red{--j-btn-face-color:var(--j-red)}.j-btn--blue{--j-btn-face-color:var(--j-blue)}.j-btn--green{--j-btn-face-color:var(--j-green)}.j-btn--tarot{--j-btn-face-color:var(--j-tarot-btn)}.j-btn--planet{--j-btn-face-color:var(--j-planet-btn)}.j-btn--spectral{--j-btn-face-color:var(--j-spectral-btn)}.j-badge{border-radius:var(--j-radius-sm);font-family:var(--j-font);letter-spacing:.04em;white-space:nowrap;text-shadow:1px 1px #000c;border:none;align-items:center;font-weight:400;display:inline-flex}.j-badge--sm{padding:2px 6px;font-size:10px}.j-badge--md{padding:4px 8px;font-size:12px}.j-badge--dark{background:var(--j-darkest);color:var(--j-white)}.j-badge--blue{background:var(--j-blue);color:var(--j-white)}.j-badge--red{background:var(--j-red);color:var(--j-white)}.j-badge--green{background:var(--j-green);color:var(--j-white)}.j-badge--orange{background:var(--j-orange);color:var(--j-white)}.j-badge--purple{background:var(--j-purple);color:var(--j-white)}.j-tabs{gap:var(--j-space-sm);scrollbar-width:none;flex-wrap:nowrap;justify-content:center;align-items:flex-end;width:100%;display:flex;overflow-x:auto}.j-tabs::-webkit-scrollbar{display:none}.j-tab{flex-direction:column;flex:none;align-items:center;display:flex;position:relative}.j-tab__indicator{justify-content:center;align-items:flex-end;height:10px;margin-bottom:3px;display:flex}.j-tab__indicator svg{fill:var(--j-red);display:block}.j-tab__indicator[data-active=true]{animation:.6s ease-in-out infinite jimbo-bounce}.j-tab__indicator[data-active=false]{visibility:hidden}.j-tab__btn{appearance:none;cursor:pointer;border-radius:var(--j-radius-md);background:var(--j-red);min-height:28px;color:var(--j-white);text-align:center;text-shadow:1px 1px #000c;border:none;outline:none;padding:6px 14px;transition:filter 80ms linear,opacity 80ms linear;box-shadow:0 3px #0009}.j-tab__btn[data-active=true]{opacity:1}.j-tab__btn[data-active=true]:hover{background:var(--j-red)}.j-tab__btn[data-active=false]:hover{background:var(--j-red);filter:brightness(1.08)}@keyframes jimbo-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.j-vtabs{gap:var(--j-space-sm);flex-direction:column;display:flex}.j-vtab{cursor:pointer;writing-mode:vertical-rl;text-orientation:mixed;background-color:#0000;border:none;border-radius:8px 0 0 8px;padding:16px 8px;transition:none;transform:rotate(180deg)}.j-vtab[data-active=true]{background-color:var(--j-gold,#e4b643);color:var(--j-black,#000)}.j-toggle-list{gap:var(--j-space-sm);flex-direction:column;display:flex}.j-toggle-list__title{font-family:var(--j-font);color:var(--j-grey);text-transform:uppercase;letter-spacing:.04em;margin-bottom:var(--j-space-sm);font-size:12px}.j-toggle-item{align-items:center;gap:var(--j-space-md);border-radius:var(--j-radius-sm);cursor:pointer;font-family:var(--j-font);color:var(--j-white);text-transform:uppercase;letter-spacing:.04em;text-align:left;background:#ffffff0d;border:1px solid #0003;justify-content:flex-start;padding:6px 8px;display:flex}.j-toggle-check{border:1px solid var(--j-dark-grey);flex-shrink:0;width:10px;height:10px;box-shadow:inset 0 1px 2px #00000080}.j-toggle-check[data-on=true]{background:var(--j-orange)}.j-toggle-check[data-on=false]{background:var(--j-darkest)}.j-tooltip{border-radius:var(--j-radius-md);background:var(--j-darkest);border:2px solid var(--j-border-silver);max-width:280px;color:var(--j-white);pointer-events:none;z-index:9999;padding:6px 10px;transition:opacity .12s;position:fixed;box-shadow:0 2px #000c}.j-items-start{align-items:flex-start}.j-justify-between{justify-content:space-between}.j-h-full{height:100%}.j-flank{justify-content:center;align-items:stretch;gap:var(--j-space-md);width:100%;display:flex;position:relative}.j-flank__content{flex-direction:column;flex:1;min-width:0;display:flex;position:relative}.j-flank__btn{width:40px;margin:var(--j-press-y) 0;border-radius:var(--j-radius-lg);cursor:pointer;background-color:var(--j-red);color:var(--j-white);text-shadow:1px 1px #000c;box-shadow:0 var(--j-press-y) 0 0 var(--j-dark-red);transition:transform var(--j-press-speed) ease, box-shadow var(--j-press-speed) ease, background-color var(--j-press-speed) ease;border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.j-flank__btn:disabled{background-color:var(--j-dark-red);cursor:default;box-shadow:none}.j-copy-row{gap:var(--j-space-sm);flex-direction:column;display:flex}.j-copy-row__field{align-items:center;gap:var(--j-space-md);display:flex}.j-copy-row__value{background:var(--j-darkest);border:2px solid var(--j-panel-edge);border-radius:var(--j-radius-sm);word-break:break-all;flex:1;padding:6px 10px}.j-copy-row__btn{font-family:var(--j-font);letter-spacing:.08em;border-radius:var(--j-radius-sm);cursor:pointer;flex-shrink:0;padding:4px 12px;font-size:11px;transition:color .15s,background .15s,border-color .15s}.j-copy-row__btn[data-copied=false]{color:var(--j-gold-text);border:1px solid var(--j-gold-text);background:#e4b6431f}.j-copy-row__btn[data-copied=true]{color:var(--j-green-text);border:1px solid var(--j-green-text);background:#35bd861f}.j-code-block{background-color:var(--j-darkest);border:2px solid var(--j-panel-edge);border-radius:var(--j-radius-lg);flex-direction:column;display:flex;overflow:hidden;box-shadow:0 3px #00000080}.j-code-block__header{border-bottom:1px solid var(--j-inner-border);justify-content:space-between;align-items:center;padding:8px 12px;display:flex}.j-code-block__meta{align-items:center;gap:8px;display:flex}.j-code-block__filename{opacity:.6;font-size:10px}.j-code-block__lang{color:#60a5fa;background:#0006;border-radius:3px;padding:1px 6px;font-size:9px}.j-code-block__copy{cursor:pointer;background:0 0;border:none;padding:4px;display:flex}.j-code-block__copy[data-copied=false]{color:#ffffff80}.j-code-block__copy[data-copied=true]{color:#4ade80}.j-code-block__pre{font-family:var(--j-font-code);color:#f6f0d5;margin:0;padding:12px;font-size:.875rem;line-height:1.6;overflow-x:auto}.j-filter-bar{padding:var(--j-space-xl);background-color:var(--j-dark-grey);border:4px solid var(--j-border-silver);box-shadow:0 3px 0 0 var(--j-border-south);border-radius:var(--j-radius-lg);flex-wrap:wrap;gap:24px;display:flex;position:relative}.j-filter-bar__field{flex:1;min-width:200px;margin-top:10px;position:relative}.j-filter-bar__pill{background-color:var(--j-red);border:2px solid var(--j-dark-red);border-radius:var(--j-radius-md);z-index:2;padding:4px 12px;position:absolute;top:-14px;left:16px}.j-filter-bar__input{background-color:var(--j-darkest);border:none;border-bottom:4px solid var(--j-panel-edge);border-radius:var(--j-radius-lg);width:100%;color:var(--j-white);font-family:var(--j-font);letter-spacing:.08em;outline:none;padding:14px 16px 14px 48px;font-size:20px}.j-filter-bar__search-icon{pointer-events:none;width:48px;color:var(--j-blue);z-index:1;justify-content:center;align-items:center;display:flex;position:absolute;top:0;bottom:0;left:0}.j-filter-bar__select{appearance:none;background-color:var(--j-orange);color:var(--j-white);border:none;border-bottom:4px solid var(--j-dark-orange);border-radius:var(--j-radius-lg);cursor:pointer;font-family:var(--j-font);letter-spacing:.08em;text-align:center;outline:none;min-width:200px;padding:14px 48px 14px 24px;font-size:18px}.j-filter-bar__sort-icon{pointer-events:none;color:var(--j-white);opacity:.85;position:absolute;top:50%;right:16px;transform:translateY(-50%)}.j-flank{justify-content:center;align-items:center;gap:var(--j-space-md);width:100%;display:flex}.j-flank__content{flex:1;justify-content:center;display:flex}.j-flank__btn{background:var(--j-red);color:var(--j-white);border-radius:var(--j-radius-sm);padding:var(--j-space-sm) var(--j-space-xs);cursor:pointer;box-shadow:0 var(--j-press-y) 0 var(--j-dark-grey);border:none;justify-content:center;align-items:center;transition:transform 50ms,box-shadow 50ms,opacity .2s;display:flex}.j-flank__btn[data-pressed=true]{transform:translateY(var(--j-press-y));box-shadow:0 0 0 var(--j-dark-grey)}.j-flank__btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:0 var(--j-press-y) 0 var(--j-dark-grey);transform:none}@keyframes jimbo-modal-in{0%{opacity:0;transform:scale(.88)}to{opacity:1;transform:scale(1)}}.j-modal-overlay{z-index:1000;padding:var(--j-space-md);background:#000000d1;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.j-modal{border-radius:12px;flex-direction:column;width:100%;max-width:345px;max-height:calc(100% - 32px);animation:.14s cubic-bezier(.2,0,.2,1.4) both jimbo-modal-in;display:flex;overflow:hidden}.j-modal .j-panel__body{min-height:0;overflow-y:auto}.j-modal__title{text-align:center;margin:0 0 var(--j-space-xl);flex-shrink:0}.j-footer{z-index:9998;pointer-events:auto;width:100%;position:fixed;bottom:0;left:0;right:0}.j-footer__bar{text-align:center;background:#000000e6;border-top:1px solid #ffffff1a;width:100%;padding:0 1rem 3px}.j-footer__text{font-family:var(--j-font);color:#fff;flex-wrap:wrap;justify-content:center;align-items:center;gap:0 .5rem;margin:0;font-size:clamp(11px,.8vw + 8px,14px);display:flex}.j-footer__link{color:var(--j-gold);text-decoration:none}.j-floating{z-index:20;position:absolute}.j-glow--must{box-shadow:0 0 0 2px var(--j-blue), 0 0 10px var(--j-blue);animation:1.6s ease-in-out infinite j-glow-pulse}.j-glow--should{box-shadow:0 0 0 2px var(--j-gold), 0 0 10px var(--j-gold);animation:1.6s ease-in-out infinite j-glow-pulse}@keyframes j-glow-pulse{0%,to{opacity:.55}50%{opacity:1}}.j-flex{display:flex}.j-flex-col{flex-direction:column;display:flex}.j-flex-wrap{flex-wrap:wrap}.j-items-center{align-items:center}.j-justify-center{justify-content:center}.j-gap-xs{gap:var(--j-space-xs)}.j-gap-sm{gap:var(--j-space-sm)}.j-gap-md{gap:var(--j-space-md)}.j-gap-lg{gap:var(--j-space-lg)}.j-gap-xl{gap:var(--j-space-xl)}.j-w-full{width:100%}.j-shrink-0{flex-shrink:0}.j-flex-1{flex:1}.j-min-w-0{min-width:0}.j-text-center{text-align:center}.j-overflow-hidden{overflow:hidden}.j-overflow-auto{overflow:auto}.j-relative{position:relative}.j-border--red{border-color:var(--j-red)}.j-border--blue{border-color:var(--j-blue)}.j-border--green{border-color:var(--j-green)}.j-border--gold{border-color:var(--j-gold)}.j-border--orange{border-color:var(--j-orange)}.j-border--purple{border-color:var(--j-purple)}.j-bg--red{background-color:var(--j-red)}.j-bg--blue{background-color:var(--j-blue)}.j-bg--green{background-color:var(--j-green)}.j-bg--gold{background-color:var(--j-gold)}.j-bg--orange{background-color:var(--j-orange)}.j-bg--purple{background-color:var(--j-purple)}.j-bg--dark-grey{background-color:var(--j-dark-grey)}.j-bg--darkest{background-color:var(--j-darkest)}.j-app{background:var(--j-darkest);width:375px;max-width:375px;height:667px;max-height:667px;font-family:var(--j-font);color:var(--j-white);flex-direction:column;margin:0 auto;display:flex;position:relative;overflow:hidden;container:jimbo/inline-size}.j-app--fluid{width:100%;max-width:750px;height:auto;min-height:400px;max-height:none}.j-app__content{min-height:0;padding:var(--j-space-lg) var(--j-space-lg) var(--j-space-md);flex-direction:column;flex:1;display:flex;overflow:hidden}.j-app__scroll{min-height:0;padding:var(--j-space-lg) var(--j-space-lg) var(--j-space-md);scrollbar-width:none;-ms-overflow-style:none;flex:1;overflow:hidden auto}.j-app__scroll::-webkit-scrollbar{display:none}.j-app__footer{padding:var(--j-space-md) var(--j-space-lg) var(--j-space-md);border-top:2px solid var(--j-black);background:var(--j-dark-grey);gap:var(--j-space-sm);flex-direction:column;flex-shrink:0;display:flex}@container jimbo (width>=401px){.j-app__content,.j-app__scroll{padding:var(--j-space-xl) var(--j-space-xl) var(--j-space-lg)}.j-app__footer{padding:var(--j-space-md) var(--j-space-xl) var(--j-space-lg)}.j-stat-grid__value{font-size:20px}.j-info-card{padding:var(--j-space-md) var(--j-space-lg)}.j-info-card__title{font-size:14px}.j-section-header__tag{font-size:12px}}.j-section-header{align-items:center;gap:var(--j-space-md);margin-bottom:var(--j-space-md);display:flex}.j-section-header__tag{font-family:var(--j-font);letter-spacing:2px;color:var(--j-white);text-shadow:var(--j-text-shadow);border-radius:3px;flex-shrink:0;padding:2px 8px;font-size:11px}.j-section-header__rule{opacity:.33;border-radius:1px;flex:1;height:2px}.j-stat-grid{background:var(--j-dark-grey);border-radius:var(--j-radius-md);padding:var(--j-space-md);border:2px solid var(--j-panel-edge);box-shadow:0 2px 0 var(--j-black);gap:var(--j-space-md);text-align:center;grid-template-columns:1fr 1fr 1fr;display:grid}.j-stat-grid__value{font-family:var(--j-font);color:var(--j-gold-text);text-shadow:var(--j-text-shadow);font-size:16px}.j-stat-grid__label{font-family:var(--j-font);color:var(--j-grey);letter-spacing:2px;margin-top:2px;font-size:9px}.j-info-card{background:var(--j-dark-grey);border-radius:var(--j-radius-md);padding:var(--j-space-md);box-shadow:0 2px 0 var(--j-black);align-items:center;gap:var(--j-space-md);cursor:pointer;border:2px solid #0000;display:flex}.j-info-card:hover{filter:brightness(1.08)}.j-info-card__body{flex:1;min-width:0}.j-info-card__title{font-family:var(--j-font);color:var(--j-white);letter-spacing:1px;text-shadow:var(--j-text-shadow);text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.j-info-card__sub{font-family:var(--j-font);color:var(--j-gold-text);letter-spacing:1px;margin-top:2px;font-size:9px}.j-info-card__aside{text-align:right;flex-shrink:0}.j-inset{background:var(--j-dark-grey);border-radius:var(--j-radius-md);padding:var(--j-space-md) var(--j-space-md);border:2px solid var(--j-panel-edge);box-shadow:0 2px 0 var(--j-black);font-family:var(--j-font);color:var(--j-grey);letter-spacing:1px;font-size:11px;line-height:1.7}.j-wordmark{text-align:center;margin-bottom:var(--j-space-xl)}.j-wordmark__title{font-family:var(--j-font);letter-spacing:3px;color:var(--j-gold-text);text-shadow:2px 2px #000c;font-size:32px;line-height:1}.j-wordmark__sub{font-family:var(--j-font);letter-spacing:4px;color:var(--j-grey);text-shadow:var(--j-text-shadow);margin-top:4px;font-size:14px}.j-seed-input{gap:var(--j-space-sm);flex-direction:column;display:flex}.j-seed-input__field{border-radius:var(--j-radius-md);border:2px solid var(--j-panel-edge);background:var(--j-darkest);width:100%;color:var(--j-gold-text);font-size:18px;font-family:var(--j-font);letter-spacing:.12em;text-transform:uppercase;text-shadow:var(--j-text-shadow);box-sizing:border-box;outline:none;padding:8px 12px;font-weight:400;transition:border-color .1s}.j-seed-input__field::placeholder{color:var(--j-grey);opacity:.6;text-transform:uppercase;letter-spacing:.06em;font-size:12px}.j-seed-input__field:focus{border-color:var(--j-gold)}.j-seed-input__field[data-valid=true]{border-color:var(--j-green)}.j-seed-input__field[data-valid=false]{border-color:var(--j-red)}.j-seed-input__field[data-valid=partial]{border-color:var(--j-panel-edge)}.j-seed-input__hint{font-family:var(--j-font);letter-spacing:.08em;color:var(--j-grey);text-shadow:var(--j-text-shadow);font-size:9px}.j-aesthetic-selector{gap:var(--j-space-sm);flex-direction:column;display:flex}.j-aesthetic-selector__list{gap:var(--j-space-sm);flex-wrap:wrap;display:flex}.j-aesthetic-pill{border-radius:var(--j-radius-md);border:2px solid var(--j-panel-edge);background:var(--j-darkest);color:var(--j-grey);cursor:pointer;font-size:11px;font-family:var(--j-font);letter-spacing:.04em;text-shadow:var(--j-text-shadow);padding:4px 10px;font-weight:400;transition:border-color .1s,background .1s,color .1s;box-shadow:0 2px #0000004d}.j-aesthetic-pill:hover{border-color:var(--j-gold);color:var(--j-gold-text)}.j-aesthetic-pill[data-active=true]{border-color:var(--j-gold);color:var(--j-gold-text);box-shadow:0 0 0 1px var(--j-gold), 0 2px 0 0 #0000004d;background:#e4b64321}.j-showcase{background:var(--j-darkest);width:100%;height:100%;font-family:var(--j-font);color:var(--j-white);flex-direction:column;display:flex;overflow:hidden}.j-showcase__scroll{flex:1;min-height:0;padding:18px 14px 10px;overflow-y:auto}.j-showcase__wordmark{text-align:center;margin-bottom:18px}.j-showcase__wordmark-title{letter-spacing:3px;color:var(--j-gold-text);text-shadow:2px 2px #000c;font-size:32px;line-height:1}.j-showcase__wordmark-sub{letter-spacing:4px;color:var(--j-grey);text-shadow:var(--j-text-shadow);margin-top:4px;font-size:14px}.j-showcase__stats{background:var(--j-dark-grey);border-radius:var(--j-radius-md);border:2px solid var(--j-panel-edge);box-shadow:0 2px 0 var(--j-black);gap:var(--j-space-md);text-align:center;margin-bottom:var(--j-space-xl);grid-template-columns:1fr 1fr 1fr;padding:10px;display:grid}.j-showcase__stat-value{color:var(--j-gold-text);text-shadow:var(--j-text-shadow);font-size:16px}.j-showcase__stat-label{color:var(--j-grey);letter-spacing:2px;margin-top:2px;font-size:9px}.j-showcase__section-header{align-items:center;gap:var(--j-space-md);margin-bottom:var(--j-space-md);display:flex}.j-showcase__section-tag{letter-spacing:2px;color:var(--j-white);text-shadow:var(--j-text-shadow);border-radius:3px;padding:2px 8px;font-size:11px}.j-showcase__section-rule{border-radius:1px;flex:1;height:2px}.j-showcase__filter-list{gap:var(--j-space-md);margin-bottom:var(--j-space-xl);flex-direction:column;display:flex}.j-showcase__filter-card{background:var(--j-dark-grey);border-radius:var(--j-radius-md);box-shadow:0 2px 0 var(--j-black);cursor:pointer;align-items:center;gap:10px;padding:10px;display:flex}.j-showcase__filter-sprites{gap:2px;display:flex}.j-showcase__filter-sprite{justify-content:center;align-items:center;width:30px;height:40px;display:flex}.j-showcase__filter-info{flex:1;min-width:0}.j-showcase__filter-name{color:var(--j-white);letter-spacing:1px;text-shadow:var(--j-text-shadow);text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.j-showcase__filter-author{color:var(--j-gold-text);letter-spacing:1px;margin-top:2px;font-size:9px}.j-showcase__filter-hits{text-align:right}.j-showcase__filter-hits-value{text-shadow:var(--j-text-shadow);font-size:14px}.j-showcase__filter-hits-label{color:var(--j-grey);letter-spacing:1px;font-size:8px}.j-showcase__recent{background:var(--j-dark-grey);border-radius:var(--j-radius-md);border:2px solid var(--j-panel-edge);box-shadow:0 2px 0 var(--j-black);color:var(--j-grey);letter-spacing:1px;padding:8px 10px;font-size:11px;line-height:1.7}.j-showcase__actions{border-top:2px solid var(--j-black);background:var(--j-dark-grey);flex-direction:column;gap:6px;padding:8px 10px 10px;display:flex}.j-footer__suits{align-items:center;display:inline-flex}.j-footer__suit-stage{vertical-align:middle;width:1.5em;height:1em;display:inline-block;position:relative}.j-footer__suit-char{opacity:0;justify-content:center;align-items:center;animation-duration:5s;animation-timing-function:ease-out;animation-iteration-count:infinite;animation-delay:0s;display:inline-flex;position:absolute;inset:0}.j-copy-row__label{letter-spacing:2px}.j-motely-badge{align-items:center;gap:6px;display:inline-flex}.j-motely-badge--chip{border-radius:var(--j-radius-sm);background:var(--j-darkest);border:1px solid var(--j-panel-edge);padding:3px 8px}.j-text--dance-container{display:inline-flex}.j-font-dance-char{animation:3s ease-in-out infinite j-font-dance;display:inline-block}.hide-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.hide-scrollbar::-webkit-scrollbar{display:none}.j-juice-hover{transition:transform .2s cubic-bezier(.175,.885,.32,1.275)}.j-juice-hover:hover{z-index:5;transform:scale(1.05)translateY(-2px)}
+/*$vite$:1*/