:root {
  --g-sort-wall-top: #e9cfa4;
  --g-sort-wall-bottom: #d9b583;
  --g-sort-plank: rgba(120, 78, 40, 0.22);
  --g-sort-knot: rgba(120, 78, 40, 0.3);
  --g-sort-window: #a7d8f2;
  --g-sort-window-low: #d6f0e0;
  --g-sort-frame: #b98552;
  --g-sort-hill: #9fd27f;
  --g-sort-shelf: #b67a45;
  --g-sort-shelf-top: #d29a62;
  --g-sort-shelf-dark: #7d4f2a;
  --g-sort-floor: #a8743f;
  --g-sort-glass: rgba(220, 244, 255, 0.34);
  --g-sort-glass-edge: rgba(70, 120, 150, 0.55);
  --g-sort-glass-shine: rgba(255, 255, 255, 0.55);
  --g-sort-cork: #c99a63;
  --g-sort-cork-dark: #8a6136;
  --g-sort-husk: #8c6a4a;
  --g-sort-husk-dark: #5e4430;
  --g-sort-pick: #ffe27a;
  --g-sort-hint: #7ee0a8;
  --g-sort-chip: rgba(255, 250, 242, 0.92);
  --g-sort-chip-ink: #4a3348;
  --g-sort-honey: #f4b63a;
  --g-sort-honey-dark: #b9781d;
  --g-sort-honey-light: #ffe08a;
  --g-sort-amber: #f0a43c;
  --g-sort-amber-edge: rgba(150, 82, 20, 0.8);
  --g-sort-amber-shine: rgba(255, 246, 214, 0.85);
  --g-sort-tag: #fff6e2;
  --g-sort-tag-edge: #b98d5c;
  --g-sort-tag-string: #9a6b3f;
  --g-sort-vine: #5fae4a;
  --g-sort-vine-dark: #2f6b2b;
  --g-sort-vine-leaf: #7fcb5c;
  --g-sort-badge-ink: #ffffff;
  --g-sort-intro-bg: rgba(255, 250, 242, 0.95);
  --g-sort-intro-ink: #4a3348;
  --g-sort-intro-soft: #7a6378;
  --g-sort-intro-icon-bg: #f2e3c8;
  --g-sort-intro-fs: 15px;
  --g-sort-intro-sub-fs: 13px;
  --g-sort-intro-icon: 50px;
  --g-sort-intro-pad: 10px;
  --g-sort-intro-hold: 6s;
  --g-sort-intro-tail: 1s;
  --g-sort-intro-fade: 0.3s;
  --g-sort-untie: 0.6s;
  --g-sort-jar-max: 84px;
  --g-sort-pad: 12px;
  --g-sort-top: 118px;
  --g-sort-bottom: 108px;
  --g-sort-gap: 8px;
  --g-sort-lift: 16px;
  --g-sort-chip-fs: 14px;
  --g-sort-float-fs: 18px;
  --g-sort-fly: 0.34s;
  --g-sort-stagger: 0.07s;
  --g-sort-btn: 52px;
  --g-sort-btn-icon: 22px;
  --g-sort-sr: 1px;
  --g-sort-banner-fs: 21px;
  --g-sort-banner-sub: 15px;
  --g-sort-banner-w: 320px;
}

:root.is-dark {
  --g-sort-wall-top: #4a3a2c;
  --g-sort-wall-bottom: #3a2c20;
  --g-sort-plank: rgba(0, 0, 0, 0.25);
  --g-sort-knot: rgba(0, 0, 0, 0.3);
  --g-sort-window: #26305a;
  --g-sort-window-low: #3d4d7a;
  --g-sort-frame: #6e4c2c;
  --g-sort-hill: #2f5a45;
  --g-sort-shelf: #7a5130;
  --g-sort-shelf-top: #946440;
  --g-sort-shelf-dark: #4c301a;
  --g-sort-floor: #5c3f24;
  --g-sort-glass: rgba(200, 230, 255, 0.16);
  --g-sort-glass-edge: rgba(190, 220, 240, 0.45);
  --g-sort-glass-shine: rgba(255, 255, 255, 0.35);
  --g-sort-cork: #a67c4c;
  --g-sort-cork-dark: #6b4a28;
  --g-sort-chip: rgba(36, 28, 60, 0.9);
  --g-sort-chip-ink: #f6eefc;
  --g-sort-honey: #d99a2b;
  --g-sort-honey-dark: #8a5614;
  --g-sort-honey-light: #f2c96a;
  --g-sort-amber: #d48a2a;
  --g-sort-amber-edge: rgba(255, 190, 110, 0.7);
  --g-sort-amber-shine: rgba(255, 240, 210, 0.6);
  --g-sort-tag: #e9dcc4;
  --g-sort-tag-edge: #8a6a44;
  --g-sort-tag-string: #c49a6c;
  --g-sort-vine: #4f9442;
  --g-sort-vine-dark: #24502a;
  --g-sort-vine-leaf: #66ad4e;
  --g-sort-intro-bg: rgba(36, 28, 60, 0.94);
  --g-sort-intro-ink: #f6eefc;
  --g-sort-intro-soft: #cbbfe0;
  --g-sort-intro-icon-bg: rgba(255, 255, 255, 0.1);
}

#game-dom .g-sort-ui {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

#game-dom .g-sort-jar {
  position: absolute;
  pointer-events: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--r-m);
  background: transparent;
  color: transparent;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

#game-dom .g-sort-jar:focus {
  outline: none;
}

#game-dom .g-sort-jar:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
}

#game-dom .g-sort-undo {
  position: absolute;
  right: var(--g-sort-pad);
  bottom: calc(var(--g-sort-pad) + 4px);
  pointer-events: auto;
  min-width: var(--g-sort-btn);
  height: var(--g-sort-btn);
  padding: 0 var(--gap-s);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--gap-xs);
  border: 0;
  border-radius: var(--r-pill);
  background: var(--hud-glass);
  box-shadow: var(--clay);
  color: var(--ink);
  font: inherit;
  font-weight: var(--fw-x);
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  touch-action: manipulation;
}

#game-dom .g-sort-undo svg {
  width: var(--g-sort-btn-icon);
  height: var(--g-sort-btn-icon);
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#game-dom .g-sort-undo:disabled {
  opacity: 0.45;
  cursor: default;
}

#game-dom .g-sort-undo:active:not(:disabled) {
  transform: scale(var(--press-s));
}

#game-dom .g-sort-sr {
  position: absolute;
  width: var(--g-sort-sr);
  height: var(--g-sort-sr);
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  pointer-events: none;
}