body[data-skin="v2"] {
  --ds-col: 620px;
  --ds-rail: 460px;
  --ds-gutter: 12px;
  --ds-safe-top: max(10px, env(safe-area-inset-top));
  --ds-safe-bottom: max(10px, env(safe-area-inset-bottom));
  --ds-stage-top-base: 132px;
  --ds-stage-bottom-base: 116px;
  --ds-stage-top: calc(var(--ds-stage-top-base) + var(--ds-veil-pad));
  --ds-stage-bottom: calc(var(--ds-stage-bottom-base) + var(--ds-veil-pad));
  --ds-stage-lead: min(3svh, 20px);

  --ds-disp: -apple-system, "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", sans-serif;

  --ds-fs-micro: 9.5px;
  --ds-fs-meta: 10.5px;
  --ds-fs-tag: 11.5px;
  --ds-fs-row: 12.5px;
  --ds-fs-num: 13px;
  --ds-fs-tele: 14.5px;
  --ds-fs-body: 15px;
  --ds-fs-title: clamp(24px, 3.4vw, 30px);
  --ds-lh-body: 1.95;
  --ds-ls-title: 0.02em;
  --ds-ls-disp: 0.03em;
  --ds-ls-key: 0.13em;
  --ds-ls-sec: 0.16em;

  --ds-r-card: 16px;
  --ds-r-opt: 13px;
  --ds-r-chip: 9px;
  --ds-r-bar: 2px;

  --ds-blur: 10px;
  --ds-glass-anchor: color-mix(in srgb, var(--panel) 74%, transparent);
  --ds-glass-sheet: color-mix(in srgb, var(--panel) 82%, transparent);
  --ds-glass-opt: color-mix(in srgb, var(--panel2) 62%, transparent);
  --ds-glass-opt-hover: color-mix(in srgb, var(--panel2) 80%, transparent);
  --ds-hairline: color-mix(in srgb, var(--edge) 70%, transparent);
  --ds-hairline-soft: color-mix(in srgb, var(--edge) 55%, transparent);
  --ds-shadow-anchor: 0 6px 22px rgba(0, 0, 0, 0.38);
  --ds-shadow-sheet: 0 -6px 26px rgba(0, 0, 0, 0.4);
  --ds-shadow-text: 0 1px 8px rgba(0, 0, 0, 0.45);

  --ds-veil: rgba(12, 14, 18, 0.62);
  --ds-veil-pad: 16px;

  --ds-r0: var(--green);
  --ds-r1: #f5b43c;
  --ds-r2: #ff8a3d;
  --ds-r3: var(--red);

  --ds-scrim: linear-gradient(
    180deg,
    rgba(16, 18, 22, 0.58) 0%,
    rgba(16, 18, 22, 0.22) 30%,
    rgba(13, 15, 19, 0.3) 55%,
    rgba(13, 15, 19, 0.78) 84%,
    rgba(13, 15, 19, 0.92) 100%
  );
  --ds-scrim-wide:
    radial-gradient(120% 90% at 50% 50%, transparent 42%, rgba(13, 15, 19, 0.55) 100%),
    linear-gradient(
      180deg,
      rgba(16, 18, 22, 0.55) 0%,
      rgba(16, 18, 22, 0.18) 30%,
      rgba(13, 15, 19, 0.26) 55%,
      rgba(13, 15, 19, 0.74) 84%,
      rgba(13, 15, 19, 0.9) 100%
    );

  --ds-t-expand: 0.38s;
  --ds-t-drawer: 0.4s;
  --ds-t-page: 0.7s;
  --ds-t-scene: 0.9s;
  --ds-t-bump: 0.5s;
  --ds-t-delta: 2.2s;
  --ds-t-hover: 0.2s;
  --ds-ease-page: cubic-bezier(0.3, 0.8, 0.3, 1);
  --ds-ease-panel: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ds-slide: 34px;
  --ds-bump-lift: 4px;

  --ds-stat-lo: 40;
  --ds-stat-hi: 100;
  --ds-bar-peek: 3px;
  --ds-bar-full: 5px;
  --ds-icon: 15px;
  --ds-icon-stroke: 1.8;

  --ds-scene-fallback:
    radial-gradient(120% 90% at 50% 15%, rgba(255, 150, 70, 0.22), transparent 60%),
    linear-gradient(180deg, #201a16 0%, #14110f 55%, #0c0b0a 100%);
}

body[data-skin="v2"] #scene {
  position: fixed;
  inset: 0;
  z-index: 0;
  background: var(--ds-scene-fallback);
}
body[data-skin="v2"] #app {
  position: relative;
  z-index: 1;
  overflow-x: hidden;
  overflow-x: clip;
  overflow-clip-margin: var(--ds-card-bleed-x);
}
body[data-skin="v2"] #scene .ds-layer {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity var(--ds-t-scene) ease;
}
body[data-skin="v2"] #scene .ds-layer.on {
  opacity: 1;
}
body[data-skin="v2"] #scene .ds-layer.sc-dusk {
  background: url("/assets/scene/dusk-smoke.jpg") center 34% / cover no-repeat;
}
body[data-skin="v2"] #scene .ds-layer.sc-dusk::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--ds-scrim);
}
@media (min-width: 900px) {
  body[data-skin="v2"] #scene .ds-layer.sc-dusk::after {
    background: var(--ds-scrim-wide);
  }
}
body[data-skin="v2"] #scene .ds-layer.sc-rain {
  background:
    radial-gradient(130% 55% at 50% -12%, rgba(77, 163, 255, 0.2), transparent 58%),
    radial-gradient(70% 40% at 88% 70%, rgba(77, 163, 255, 0.07), transparent 60%),
    linear-gradient(160deg, #0d1420 0%, #0c1018 52%, #090b10 100%);
}
body[data-skin="v2"] #scene .ds-layer.sc-rain::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(112deg, transparent 0 17px, rgba(150, 190, 255, 0.05) 17px 18px);
}

body[data-skin="v2"] #scene .ds-layer.sc-legend {
  background:
    url("/assets/scene/legend/default.jpg") center 88% / cover no-repeat,
    radial-gradient(120% 82% at 50% 12%, rgba(226, 138, 78, 0.28), transparent 60%),
    linear-gradient(176deg, #2a201a 0%, #1a1512 54%, #0d0b0a 100%);
}
body[data-skin="v2"] #scene .ds-layer.sc-legend::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--ds-scrim);
}
@media (min-width: 900px) {
  body[data-skin="v2"] #scene .ds-layer.sc-legend::after {
    background: var(--ds-scrim-wide);
  }
}

body[data-skin="v2"] #board {
  position: fixed;
  top: var(--ds-safe-top);
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  width: min(calc(100% - 2 * var(--ds-gutter)), var(--ds-rail));
  margin: 0;
  padding: 12px 14px 22px;
  background: var(--ds-glass-anchor);
  backdrop-filter: blur(var(--ds-blur));
  -webkit-backdrop-filter: blur(var(--ds-blur));
  border: 1px solid var(--ds-hairline);
  border-bottom: 1px solid var(--ds-hairline);
  border-radius: var(--ds-r-card);
  box-shadow: var(--ds-shadow-anchor);
}
body[data-skin="v2"] #board::before {
  content: none;
}
body[data-skin="v2"] .brand {
  font-size: 0;
  gap: 0;
  cursor: pointer;
}
body[data-skin="v2"] .brand:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: -2px;
  border-radius: var(--ds-r-chip);
}
body[data-skin="v2"] .brand .bmark {
  display: none;
}
body[data-skin="v2"] .brand .ph {
  margin: 0 0 8px;
  padding: 0;
  background: none;
  border-radius: 0;
  font-family: var(--ds-disp);
  font-size: var(--ds-fs-meta);
  line-height: 1.3;
  letter-spacing: var(--ds-ls-sec);
  text-transform: uppercase;
  color: var(--dim);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body[data-skin="v2"] .chips {
  display: block;
  gap: 0;
  margin-top: 0;
}
body[data-skin="v2"] .an-hit {
  display: block;
  width: 100%;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  color: inherit;
  font: inherit;
  text-align: inherit;
  cursor: pointer;
}
body[data-skin="v2"] .an-hit:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
  border-radius: var(--ds-r-chip);
}
body[data-skin="v2"] .an-row {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 2px 6px;
}
body[data-skin="v2"] .an-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-width: 0;
  position: relative;
}
body[data-skin="v2"] .an-key {
  font-family: var(--ds-disp);
  font-size: var(--ds-fs-micro);
  font-variant-caps: all-small-caps;
  letter-spacing: var(--ds-ls-key);
  color: var(--dim);
  white-space: nowrap;
}
body[data-skin="v2"] .an-val {
  font-family: var(--mono);
  font-size: var(--ds-fs-tele);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: var(--text);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body[data-skin="v2"] .an-val.an-sm {
  font-size: 12.5px;
}
body[data-skin="v2"] .an-val.an-xs {
  font-size: 11px;
}
body[data-skin="v2"] .an-val.ds-ok,
body[data-skin="v2"] .an-num .ds-ok {
  color: var(--green);
}
body[data-skin="v2"] .an-val.ds-warn,
body[data-skin="v2"] .an-num .ds-warn {
  color: var(--red);
}
body[data-skin="v2"] .an-val.ds-rk1,
body[data-skin="v2"] .an-rk-pos.ds-rk1 {
  color: var(--yellow);
}
body[data-skin="v2"] .an-val.ds-rk3,
body[data-skin="v2"] .an-rk-pos.ds-rk3 {
  color: var(--green);
}
body[data-skin="v2"] .an-panel {
  display: grid;
  grid-template-rows: 0fr;
}
body[data-skin="v2"] #board.open .an-panel {
  grid-template-rows: 1fr;
}
body[data-skin="v2"] .an-panel-in {
  overflow: hidden;
  min-height: 0;
}
@media (prefers-reduced-motion: no-preference) {
  body[data-skin="v2"] .an-panel {
    transition: grid-template-rows var(--ds-t-expand) var(--ds-ease-panel);
  }
}
body[data-skin="v2"] .an-sec {
  margin-top: 10px;
  font-family: var(--ds-disp);
  font-size: var(--ds-fs-tag);
  letter-spacing: var(--ds-ls-sec);
  text-transform: uppercase;
  color: var(--dim);
}
body[data-skin="v2"] .an-sec:first-child {
  margin-top: 2px;
}
body[data-skin="v2"] .an-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  font-size: var(--ds-fs-row);
  padding: 3px 0;
}
body[data-skin="v2"] .an-lbl {
  color: var(--dim);
}
body[data-skin="v2"] .an-num {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  color: var(--text);
}
body[data-skin="v2"] .an-line.an-rk {
  display: grid;
  grid-template-columns: 2.4em minmax(0, 1fr) auto 3.4em;
  gap: 8px;
  align-items: baseline;
}
body[data-skin="v2"] .an-rk-pos {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: var(--dim);
}
body[data-skin="v2"] .an-rk-nm {
  color: var(--dim);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body[data-skin="v2"] .an-rk-pts {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  color: var(--text);
}
body[data-skin="v2"] .an-rk-gap {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  font-size: var(--ds-fs-micro);
  color: var(--dim);
  text-align: right;
}
body[data-skin="v2"] .an-rk-gap.ds-up {
  color: var(--green);
}
body[data-skin="v2"] .an-rk-gap.ds-dn {
  color: var(--red);
}
body[data-skin="v2"] .an-rk-me .an-rk-nm {
  color: var(--text);
  font-weight: 700;
}
body[data-skin="v2"] .an-lang {
  margin-top: 10px;
}
body[data-skin="v2"] #stage {
  min-height: 100vh;
  min-height: 100svh;
  justify-content: flex-start;
  padding-top: calc(var(--ds-stage-top) + var(--ds-stage-lead));
}

body[data-skin="v2"] #statsPanel {
  position: fixed;
  left: 50%;
  bottom: var(--ds-safe-bottom);
  z-index: 10;
  width: min(calc(100% - 2 * var(--ds-gutter)), var(--ds-rail));
  margin: 0;
  transform: translateX(-50%);
}
body[data-skin="v2"] #stage {
  padding-bottom: var(--ds-stage-bottom);
}
body[data-skin="v2"] #statsPanel .spgrid {
  display: flex;
  flex-direction: column;
  max-height: min(72vh, 520px);
  background: var(--ds-glass-sheet);
  backdrop-filter: blur(var(--ds-blur));
  -webkit-backdrop-filter: blur(var(--ds-blur));
  border: 1px solid var(--ds-hairline);
  border-radius: var(--ds-r-card);
  box-shadow: var(--ds-shadow-sheet);
  padding: 0;
  overflow: hidden;
}

body[data-skin="v2"] #spgrid .sp-hit {
  display: block;
  width: 100%;
  flex: none;
  order: 1;
  background: none;
  border: 0;
  border-bottom: 1px solid var(--ds-hairline-soft);
  padding: 10px var(--ds-gutter);
  margin: 0;
  color: inherit;
  font: inherit;
  text-align: inherit;
  cursor: pointer;
}
body[data-skin="v2"] #spgrid .sp-hit:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: -2px;
}
body[data-skin="v2"] #spgrid .sp-row {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 4px;
}
body[data-skin="v2"] #spgrid .sp-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  min-width: 0;
}
body[data-skin="v2"] #spgrid .sp-icon {
  width: var(--ds-icon);
  height: var(--ds-icon);
  stroke-width: var(--ds-icon-stroke);
  stroke: var(--dim);
}
body[data-skin="v2"] #spgrid .sp-num {
  font-family: var(--mono);
  font-size: var(--ds-fs-num);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: var(--text);
}
body[data-skin="v2"] #spgrid .sp-peek {
  display: block;
  width: 100%;
  height: var(--ds-bar-peek);
  border-radius: var(--ds-r-bar);
  background: var(--ds-hairline);
  overflow: hidden;
}

body[data-skin="v2"] #spgrid .sp-body {
  order: 2;
  min-height: 0;
  max-height: 0;
  overflow: hidden;
  padding: 0 var(--ds-gutter);
  visibility: hidden;
}
body[data-skin="v2"] #statsPanel.open #spgrid .sp-body {
  max-height: min(62vh, 440px);
  overflow-y: auto;
  padding: 12px var(--ds-gutter) 4px;
  visibility: visible;
}
@media (prefers-reduced-motion: no-preference) {
  body[data-skin="v2"] #spgrid .sp-body {
    transition:
      max-height var(--ds-t-drawer) var(--ds-ease-panel),
      padding var(--ds-t-drawer) var(--ds-ease-panel);
  }
}
body[data-skin="v2"] #spgrid .sp-sec {
  margin-top: 10px;
  font-family: var(--ds-disp);
  font-size: var(--ds-fs-tag);
  letter-spacing: var(--ds-ls-sec);
  text-transform: uppercase;
  color: var(--dim);
}
body[data-skin="v2"] #spgrid .sp-sec:first-child {
  margin-top: 2px;
}
body[data-skin="v2"] #spgrid .sp-line {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--ds-fs-row);
  padding: 4px 0;
}
body[data-skin="v2"] #spgrid .sp-lbl {
  flex: none;
  width: 4.4em;
  color: var(--dim);
}
body[data-skin="v2"] #spgrid .sp-fill {
  display: block;
  height: 100%;
  border-radius: var(--ds-r-bar);
  background: var(--dim);
  width: clamp(0%, calc((var(--v) - var(--ds-stat-lo)) / (var(--ds-stat-hi) - var(--ds-stat-lo)) * 100%), 100%);
}
body[data-skin="v2"] #spgrid .sp-fullbar {
  position: relative;
  flex: 1 1 auto;
  height: var(--ds-bar-full);
  border-radius: var(--ds-r-bar);
  background: var(--ds-hairline);
  overflow: visible;
}
body[data-skin="v2"] #spgrid .sp-pot {
  position: absolute;
  top: -1px;
  bottom: -1px;
  width: 2.5px;
  border-radius: var(--ds-r-bar);
  background: var(--purple);
  left: clamp(0%, calc((var(--pot) - var(--ds-stat-lo)) / (var(--ds-stat-hi) - var(--ds-stat-lo)) * 100%), 100%);
}
body[data-skin="v2"] #spgrid .sp-valfull {
  flex: none;
  min-width: 3.2em;
  text-align: right;
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  color: var(--text);
}
body[data-skin="v2"] #spgrid .sp-valfull small {
  color: var(--dim);
  font-size: var(--ds-fs-micro);
}
body[data-skin="v2"] #spgrid .sp-traits {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}
body[data-skin="v2"] #spgrid .sp-trait-pos {
  color: var(--purple);
}
body[data-skin="v2"] #spgrid .sp-trait-neg {
  color: var(--red);
}
body[data-skin="v2"] #spgrid .sp-fam {
  gap: 6px;
}

body[data-skin="v2"] #stage .card:not(.gpcard):not(.gold) {
  position: relative;
  background: none;
  border: none;
  box-shadow: none;
  width: 100%;
  max-width: var(--ds-col);
  margin-inline: auto;
  text-shadow: var(--ds-shadow-text);
}
body[data-skin="v2"] .fade {
  background: var(--ds-veil);
  margin-inline: calc(50% - 50vw);
  padding: var(--ds-veil-pad) calc(50vw - 50% + 16px);
}
@media (min-width: 640px) {
  body[data-skin="v2"] .fade {
    margin-inline: auto;
    padding-inline: 16px;
    border-radius: var(--ds-r-card);
  }
}
body[data-skin="v2"] {
  overflow-x: hidden;
  overflow-x: clip;
}
body[data-skin="v2"] #stage .card:not(.gpcard):not(.gold) .btn:not(.primary) {
  background: var(--ds-glass-opt);
  border: 1px solid var(--ds-hairline-soft);
  border-radius: var(--ds-r-opt);
  transition:
    background var(--ds-t-hover) ease,
    border-color var(--ds-t-hover) ease;
}
@media (hover: hover) and (pointer: fine) {
  body[data-skin="v2"] #stage .card:not(.gpcard):not(.gold) .btn:not(.primary):hover {
    background: var(--ds-glass-opt-hover);
    border-color: var(--ds-hairline-soft);
  }
}
body[data-skin="v2"] #stage .card.gold {
  border-color: color-mix(in srgb, #e8a020 55%, transparent);
  box-shadow:
    0 4px 20px rgba(0, 0, 0, 0.25),
    0 0 26px color-mix(in srgb, #e8a020 20%, transparent);
}

body[data-skin="v2"] .fade {
  animation: ds-pageturn var(--ds-t-page) var(--ds-ease-page);
}
@keyframes ds-pageturn {
  from {
    opacity: 0;
    transform: translateX(var(--ds-slide));
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

body[data-skin="v2"] #foot {
  padding: 10px 16px 0;
  font-size: var(--ds-fs-micro);
  line-height: 1.5;
  opacity: 0.72;
  padding-bottom: calc(var(--ds-stage-bottom) + var(--ds-gutter));
}

body[data-skin="v2"] .an-val.ds-bump {
  display: inline-block;
  animation: ds-bump var(--ds-t-bump) var(--ds-ease-panel);
}
@keyframes ds-bump {
  0% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(calc(-1 * var(--ds-bump-lift)));
  }
  100% {
    transform: translateY(0);
  }
}
body[data-skin="v2"] .ds-delta {
  position: absolute;
  left: 50%;
  top: 100%;
  white-space: nowrap;
  pointer-events: none;
  font-family: var(--mono);
  font-size: var(--ds-fs-micro);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  animation: ds-delta-pop var(--ds-t-delta) ease-out forwards;
}
body[data-skin="v2"] .ds-delta.ds-up {
  color: var(--green);
}
body[data-skin="v2"] .ds-delta.ds-dn {
  color: var(--red);
}
@keyframes ds-delta-pop {
  0% {
    opacity: 0;
    transform: translate(-50%, 2px);
  }
  10% {
    opacity: 1;
    transform: translate(-50%, -2px);
  }
  80% {
    opacity: 1;
    transform: translate(-50%, -2px);
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -8px);
  }
}
@media (prefers-reduced-motion: reduce) {
  body[data-skin="v2"] .ds-delta {
    display: none;
  }
  body[data-skin="v2"] .an-val.ds-bump,
  body[data-skin="v2"] .sp-num.ds-bump {
    animation: none;
  }
}

body[data-skin="v2"] .ds-r0 {
  color: var(--ds-r0);
}
body[data-skin="v2"] .ds-r1 {
  color: var(--ds-r1);
}
body[data-skin="v2"] .ds-r2 {
  color: var(--ds-r2);
}
body[data-skin="v2"] .ds-r3 {
  color: var(--ds-r3);
}
body[data-skin="v2"] .ds-delta.ds-up.ds-r0 {
  color: var(--ds-r0);
}
body[data-skin="v2"] .ds-delta.ds-up.ds-r1 {
  color: var(--ds-r1);
}
body[data-skin="v2"] .ds-delta.ds-up.ds-r2 {
  color: var(--ds-r2);
}
body[data-skin="v2"] .ds-delta.ds-up.ds-r3 {
  color: var(--ds-r3);
}

body[data-skin="v2"] #spgrid .sp-icon.ds-r1 {
  stroke: var(--ds-r1);
}
body[data-skin="v2"] #spgrid .sp-icon.ds-r2 {
  stroke: var(--ds-r2);
}
body[data-skin="v2"] #spgrid .sp-icon.ds-r3 {
  stroke: var(--ds-r3);
}

body[data-skin="v2"] #spgrid .sp-hit {
  padding-top: 20px;
}
body[data-skin="v2"] #spgrid .sp-cell {
  position: relative;
}
body[data-skin="v2"] #spgrid .sp-cell .ds-delta {
  top: auto;
  bottom: 100%;
  margin-bottom: 1px;
}
body[data-skin="v2"] .sp-num.ds-bump {
  display: inline-block;
  animation: ds-bump var(--ds-t-bump) var(--ds-ease-panel);
}

body[data-skin="v2"] .ds-conv {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  white-space: nowrap;
}
body[data-skin="v2"] .ds-conv.ds-r0 {
  color: var(--ds-r0);
}
body[data-skin="v2"] .ds-conv.ds-r1 {
  color: var(--ds-r1);
}
body[data-skin="v2"] .ds-conv.ds-r2 {
  color: var(--ds-r2);
}
body[data-skin="v2"] .ds-conv.ds-r3 {
  color: var(--ds-r3);
}



body[data-skin="v2"] .brand .ph-year {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--text);
}
body[data-skin="v2"] .brand .ph-year::after {
  content: "·";
  margin: 0 6px;
  font-weight: 400;
  color: var(--dim);
}

body[data-skin="v2"] #stage .card:not(.gpcard) {
  padding: 12px 14px;
}
body[data-skin="v2"] #stage .card:not(.gpcard) h2 {
  font-size: 14.5px;
  gap: 8px;
  margin-bottom: 7px;
}
body[data-skin="v2"] #stage .card:not(.gpcard) h2 > .ico {
  width: 24px;
  height: 24px;
  padding: 5px;
}
body[data-skin="v2"] #stage .card:not(.gpcard) h2 > .flag {
  width: 24px;
  height: 24px;
  font-size: 14px;
}
body[data-skin="v2"] #stage .card .btn {
  padding: 8px 13px;
  font-size: 14px;
  margin-top: 6px;
}
body[data-skin="v2"] #stage .card > .btn:first-of-type {
  margin-top: 10px;
}
body[data-skin="v2"] #stage .card .btn small {
  font-size: 11.5px;
  margin-top: 2px;
}

body[data-skin="v2"] #stage .card:not(.gpcard) .evline,
body[data-skin="v2"] #stage .card:not(.gpcard) .sub {
  font-size: var(--ds-fs-body);
  line-height: 1.7;
  margin: 8px 0;
}
body[data-skin="v2"] #stage .card:not(.gpcard) h2 + .sub {
  color: var(--text);
}

body[data-skin="v2"] .an-reveal {
  display: inline;
  padding: 0;
  margin: 0;
  background: none;
  border: 0;
  color: inherit;
  font: inherit;
  font-family: var(--sans);
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}
body[data-skin="v2"] .an-reveal:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
  border-radius: var(--ds-r-chip);
}
body[data-skin="v2"] .an-fam .an-num {
  min-width: 0;
  text-align: right;
  white-space: normal;
}
body[data-skin="v2"] .an-fam-ty {
  display: none;
  color: var(--dim);
}
body[data-skin="v2"] .an-reveal.an-revealed .an-fam-ty {
  display: inline;
}
body[data-skin="v2"] .an-reveal.an-revealed .an-fam-ty::before {
  content: "·";
  margin: 0 5px;
}
body[data-skin="v2"] .an-line .an-reveal .ico {
  vertical-align: -2px;
}

body[data-skin="v2"] #stage .card .btn:not(.primary):has(> small) {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 12px;
  row-gap: 2px;
}
body[data-skin="v2"] #stage .card .btn:not(.primary):has(> small) > small {
  margin: 0 0 0 auto;
}