:root {
  --ency-ink: #20334f;
  --ency-muted: #65758d;
  --ency-soft: #8b9ab0;
  --ency-line: rgba(63, 92, 130, .16);
  --ency-line-strong: rgba(63, 92, 130, .28);
  --ency-paper: #f8fbff;
  --ency-surface: rgba(255, 255, 255, .82);
  --ency-blue: #3f6da8;
  --ency-blue-deep: #284f82;
  --ency-blue-pale: #e6effa;
  --ency-gold: #a9864e;
  --ency-shadow: 0 18px 48px rgba(44, 72, 108, .11);
  --ency-radius: 22px;
  --ency-font: "Microsoft YaHei UI", "PingFang SC", "Noto Sans CJK SC", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: #edf4fb; }
body {
  min-width: 0;
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 9% 8%, rgba(159, 194, 231, .28), transparent 28rem),
    radial-gradient(circle at 92% 34%, rgba(214, 224, 243, .42), transparent 32rem),
    linear-gradient(180deg, #edf5fd 0, #f8fbff 33rem, #eef4fa 100%);
  color: var(--ency-ink);
  font-family: var(--ency-font);
  font-variant-numeric: tabular-nums;
}
body::before {
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  content: "";
  opacity: .16;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cg fill='none' stroke='%235b7597' stroke-opacity='.18'%3E%3Cpath d='M0 36h72M36 0v72'/%3E%3Ccircle cx='36' cy='36' r='2'/%3E%3C/g%3E%3C/svg%3E");
}
a { color: inherit; }
button, input { font: inherit; }
button { color: inherit; }
img { max-width: 100%; }

.skip-link {
  position: fixed;
  z-index: 30;
  top: .75rem;
  left: .75rem;
  padding: .65rem .9rem;
  border-radius: .45rem;
  background: #fff;
  color: var(--ency-blue-deep);
  box-shadow: var(--ency-shadow);
  transform: translateY(-160%);
}
.skip-link:focus { transform: translateY(0); }

.ency-topbar {
  position: sticky;
  z-index: 20;
  top: 0;
  display: flex;
  min-height: 4.5rem;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: 0 max(1.5rem, calc((100vw - 86rem) / 2));
  border-bottom: 1px solid rgba(73, 104, 145, .14);
  background: rgba(247, 251, 255, .84);
  box-shadow: 0 8px 28px rgba(57, 83, 116, .04);
  backdrop-filter: blur(20px) saturate(130%);
}
.ency-brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: .7rem;
  text-decoration: none;
}
.ency-brand-mark {
  display: grid;
  width: 2.45rem;
  height: 2.45rem;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .8);
  border-radius: 42% 58% 50% 46%;
  background: var(--ency-blue-deep);
  color: #fff;
  font-size: 1rem;
  font-weight: 800;
  box-shadow: 0 .55rem 1.25rem rgba(40, 79, 130, .2);
}
.ency-brand-mark img { width: 92%; height: 70%; object-fit: contain; }
.ency-brand b { display: block; font-size: .95rem; letter-spacing: .08em; }
.ency-brand small { display: block; margin-top: .12rem; color: var(--ency-soft); font-size: .53rem; letter-spacing: .17em; }
.ency-topbar nav { display: flex; align-self: stretch; gap: clamp(1rem, 2.2vw, 2.1rem); }
.ency-topbar nav a {
  position: relative;
  display: grid;
  place-items: center;
  color: #64758d;
  font-size: .8rem;
  font-weight: 600;
  text-decoration: none;
}
.ency-topbar nav a::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  background: var(--ency-blue);
  content: "";
  opacity: 0;
  transform: scaleX(.4);
  transition: .22s ease;
}
.ency-topbar nav a:hover, .ency-topbar nav a.is-current { color: var(--ency-blue-deep); }
.ency-topbar nav a:hover::after, .ency-topbar nav a.is-current::after { opacity: 1; transform: scaleX(1); }

.ency-hero {
  position: relative;
  isolation: isolate;
  min-height: 32rem;
  overflow: hidden;
  border-bottom: 1px solid rgba(68, 99, 139, .14);
  background: #dfeaf7;
}
.ency-hero picture, .ency-hero picture img {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
}
.ency-hero picture img { object-fit: cover; object-position: center 36%; }
.ency-hero-wash {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(245, 250, 255, .97) 0, rgba(245, 250, 255, .88) 34%, rgba(242, 248, 254, .36) 60%, rgba(238, 246, 253, .04) 78%),
    linear-gradient(0deg, rgba(235, 244, 252, .6), transparent 34%);
}
.ency-hero-copy {
  width: min(100% - 3rem, 86rem);
  margin: 0 auto;
  padding: 5.7rem 0 6rem;
}
.ency-hero-copy > * { display: block; max-width: 36rem; }
.ency-hero-copy > p,
.ency-section-heading p,
.ency-workspace-header p,
.ency-integrity > div p {
  margin: 0 0 .75rem;
  color: var(--ency-blue);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .18em;
}
.ency-hero h1 {
  max-width: 42rem;
  margin: 0;
  color: #1f416b;
  font-size: clamp(3rem, 6.2vw, 5.6rem);
  font-weight: 800;
  line-height: .98;
  letter-spacing: -.055em;
  text-wrap: balance;
}
.ency-hero-copy > strong { margin-top: 1.55rem; font-size: 1.18rem; line-height: 1.55; }
.ency-hero-copy > span { margin-top: .7rem; color: #5d7190; font-size: .9rem; line-height: 1.85; text-wrap: pretty; }
.ency-hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.7rem; }
.ency-hero-actions a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  padding: .75rem 1rem;
  border: 1px solid rgba(56, 92, 139, .2);
  border-radius: .65rem;
  background: rgba(255, 255, 255, .78);
  color: var(--ency-blue-deep);
  font-size: .78rem;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 .8rem 1.6rem rgba(48, 81, 121, .08);
  transition: transform .2s ease, background .2s ease, color .2s ease;
}
.ency-hero-actions a:first-child { border-color: transparent; background: var(--ency-blue-deep); color: #fff; }
.ency-hero-actions a:hover { transform: translateY(-2px); }
.ency-hero-actions a:active { transform: translateY(0) scale(.98); }
.ency-source-summary {
  position: absolute;
  right: max(1.5rem, calc((100vw - 86rem) / 2));
  bottom: 2.1rem;
  display: flex;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .78);
  border-radius: 1rem;
  background: rgba(252, 254, 255, .72);
  box-shadow: var(--ency-shadow), inset 0 0 0 1px rgba(255, 255, 255, .5);
  backdrop-filter: blur(16px);
}
.ency-source-summary div { min-width: 7.2rem; padding: 1rem 1.15rem; border-right: 1px solid var(--ency-line); }
.ency-source-summary div:last-child { border: 0; }
.ency-source-summary dt { color: var(--ency-blue-deep); font-size: 1.25rem; font-weight: 800; }
.ency-source-summary dd { margin: .2rem 0 0; color: var(--ency-muted); font-size: .65rem; }

.ency-command,
.ency-workspace,
.ency-integrity {
  width: min(100% - 3rem, 86rem);
  margin-right: auto;
  margin-left: auto;
}
.ency-command { padding: 5.3rem 0 2.7rem; }
.ency-command-toggle { display: none; }
.ency-section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 1.65rem;
}
.ency-section-heading h2,
.ency-workspace-header h2,
.ency-integrity h2 {
  margin: 0;
  font-size: clamp(2rem, 3.8vw, 3.7rem);
  line-height: 1.05;
  letter-spacing: -.045em;
  text-wrap: balance;
}
.ency-section-heading > span { max-width: 27rem; color: var(--ency-muted); font-size: .78rem; line-height: 1.75; text-align: right; }
.ency-mode-categories {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .55rem;
  margin-bottom: .75rem;
  padding: .35rem;
  border: 1px solid var(--ency-line);
  border-radius: 1rem;
  background: rgba(239, 246, 253, .72);
}
.ency-mode-categories button {
  min-width: 0;
  padding: .72rem .85rem;
  border: 0;
  border-radius: .72rem;
  background: transparent;
  color: var(--ency-muted);
  text-align: left;
  cursor: pointer;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}
.ency-mode-categories button:hover { background: rgba(255, 255, 255, .72); color: var(--ency-ink); }
.ency-mode-categories button.is-active { background: #fff; color: var(--ency-blue-deep); box-shadow: 0 .45rem 1.2rem rgba(53, 83, 118, .1); }
.ency-mode-categories strong,
.ency-mode-categories small { display: block; }
.ency-mode-categories strong { font-size: .78rem; }
.ency-mode-categories small { margin-top: .16rem; overflow: hidden; font-size: .57rem; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.ency-mode-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .6rem;
}
.ency-mode-card {
  position: relative;
  display: flex;
  min-height: 7.7rem;
  align-items: flex-start;
  flex-direction: column;
  justify-content: space-between;
  gap: .8rem;
  padding: .95rem;
  overflow: hidden;
  border: 1px solid var(--ency-line);
  border-radius: .8rem 1.15rem .8rem .8rem;
  background: rgba(255, 255, 255, .64);
  text-align: left;
  cursor: pointer;
  box-shadow: 0 .65rem 1.5rem rgba(50, 78, 111, .045);
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.ency-mode-card::after {
  position: absolute;
  right: -.7rem;
  bottom: -.8rem;
  width: 4.7rem;
  height: 4.7rem;
  border: 1px solid rgba(74, 107, 150, .1);
  border-radius: 50%;
  content: "";
}
.ency-mode-card:hover { transform: translateY(-3px); border-color: rgba(55, 98, 151, .34); box-shadow: 0 1rem 2rem rgba(47, 78, 118, .1); }
.ency-mode-card:active { transform: translateY(-1px) scale(.985); }
.ency-mode-card.is-active { border-color: transparent; background: var(--ency-blue-deep); color: #fff; box-shadow: 0 1rem 2.1rem rgba(40, 79, 130, .24); }
.ency-mode-icon { display: grid; width: 2.15rem; height: 2.15rem; place-items: center; border-radius: .55rem; background: var(--ency-blue-pale); color: var(--ency-blue-deep); font-size: .92rem; font-weight: 800; }
.ency-mode-card.is-active .ency-mode-icon { background: rgba(255, 255, 255, .16); color: #fff; }
.ency-mode-card strong { position: relative; z-index: 1; display: block; font-size: .86rem; }
.ency-mode-card small { position: relative; z-index: 1; color: var(--ency-muted); font-size: .61rem; line-height: 1.45; }
.ency-mode-card.is-active small { color: rgba(255, 255, 255, .72); }
.ency-mode-count { position: absolute; top: .82rem; right: .82rem; color: var(--ency-soft); font-size: .63rem; }
.ency-mode-card.is-active .ency-mode-count { color: rgba(255, 255, 255, .7); }
.ency-mode-more {
  display: block;
  min-height: 2.65rem;
  margin: .75rem auto 0;
  padding: 0 1.2rem;
  border: 1px solid rgba(54, 95, 144, .2);
  border-radius: 999px;
  background: rgba(255, 255, 255, .75);
  color: var(--ency-blue-deep);
  font: inherit;
  font-size: .68rem;
  font-weight: 750;
  cursor: pointer;
}
.ency-mode-more:hover { border-color: rgba(54, 95, 144, .42); background: #fff; }

.ency-workspace {
  margin-top: 2rem;
  margin-bottom: 5rem;
  padding: 1.45rem;
  border: 1px solid rgba(76, 105, 142, .16);
  border-radius: var(--ency-radius);
  background: rgba(249, 252, 255, .76);
  box-shadow: var(--ency-shadow), inset 0 1px rgba(255, 255, 255, .9);
  backdrop-filter: blur(18px);
}
.ency-workspace-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  padding: .65rem .45rem 1.4rem;
  border-bottom: 1px solid var(--ency-line);
}
.ency-workspace-header h2 { font-size: clamp(2rem, 3.3vw, 3.25rem); }
.ency-workspace-header > div > span { display: block; max-width: 48rem; margin-top: .65rem; color: var(--ency-muted); font-size: .76rem; line-height: 1.65; }
.ency-workspace-count { display: flex; align-items: baseline; gap: .4rem; white-space: nowrap; }
.ency-workspace-count strong { color: var(--ency-blue-deep); font-size: 2rem; line-height: 1; }
.ency-workspace-count span { color: var(--ency-soft); font-size: .65rem; }
.ency-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .65rem; margin: 1.1rem 0 .8rem; }
.ency-search { display: flex; min-width: 0; align-items: center; gap: .65rem; padding: 0 .9rem; border: 1px solid var(--ency-line); border-radius: .72rem; background: rgba(255, 255, 255, .9); color: var(--ency-blue); }
.ency-search input { min-width: 0; width: 100%; padding: .85rem 0; border: 0; outline: 0; background: transparent; color: var(--ency-ink); font-size: .78rem; }
.ency-toolbar > button,
.ency-filter-button,
.ency-pager button,
.ency-action-button,
.ency-choice-card,
.ency-number-stepper button {
  border: 1px solid var(--ency-line);
  background: rgba(255, 255, 255, .84);
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
}
.ency-toolbar > button { padding: 0 1rem; border-radius: .72rem; color: var(--ency-muted); font-size: .7rem; font-weight: 700; }
.ency-toolbar > button:hover { border-color: var(--ency-line-strong); color: var(--ency-blue-deep); }
.ency-filter-groups { display: grid; gap: .55rem; margin-bottom: 1rem; }
.ency-filter-group { display: grid; grid-template-columns: 4.7rem minmax(0, 1fr); align-items: start; gap: .65rem; }
.ency-filter-group > strong { padding: .55rem 0; color: var(--ency-muted); font-size: .67rem; }
.ency-filter-options { display: flex; min-width: 0; flex-wrap: wrap; gap: .35rem; }
.ency-filter-button { padding: .5rem .68rem; border-radius: .5rem; color: var(--ency-muted); font-size: .66rem; }
.ency-filter-button:hover, .ency-filter-button.is-active { border-color: rgba(58, 103, 159, .28); background: var(--ency-blue-pale); color: var(--ency-blue-deep); }
.ency-stage { display: grid; grid-template-columns: minmax(0, 1.13fr) minmax(22rem, .87fr); gap: 1rem; align-items: start; }
.ency-results-panel { min-width: 0; }
.ency-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; }
.ency-result-card {
  display: grid;
  min-width: 0;
  min-height: 6.5rem;
  grid-template-columns: 4.5rem minmax(0, 1fr);
  gap: .72rem;
  align-items: center;
  padding: .62rem;
  border: 1px solid var(--ency-line);
  border-radius: .72rem 1rem .72rem .72rem;
  background: rgba(255, 255, 255, .78);
  text-align: left;
  cursor: pointer;
  box-shadow: 0 .45rem 1.15rem rgba(51, 79, 113, .04);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.ency-result-card:hover { transform: translateY(-2px); border-color: rgba(53, 94, 147, .3); box-shadow: 0 .8rem 1.5rem rgba(45, 76, 115, .09); }
.ency-result-card.is-selected { border-color: var(--ency-blue); background: #f0f6fd; box-shadow: inset 3px 0 var(--ency-blue); }
.ency-result-media { display: grid; width: 4.5rem; height: 4.5rem; place-items: center; overflow: hidden; border-radius: .62rem; background: #edf3fa; }
.ency-result-media img { width: 100%; height: 100%; padding: .25rem; object-fit: contain; }
.ency-result-media span { padding: .4rem; color: var(--ency-soft); font-size: .56rem; line-height: 1.3; text-align: center; }
.ency-result-copy { min-width: 0; }
.ency-result-copy small { display: block; margin-bottom: .25rem; overflow: hidden; color: var(--ency-blue); font-size: .55rem; font-weight: 700; letter-spacing: .04em; text-overflow: ellipsis; white-space: nowrap; }
.ency-result-copy strong { display: block; overflow: hidden; font-size: .77rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.ency-result-copy span { display: -webkit-box; margin-top: .3rem; overflow: hidden; color: var(--ency-muted); font-size: .6rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.ency-empty { display: grid; min-height: 17rem; place-items: center; align-content: center; gap: .4rem; border: 1px dashed var(--ency-line-strong); border-radius: .9rem; color: var(--ency-muted); text-align: center; }
.ency-empty strong { color: var(--ency-ink); font-size: .9rem; }
.ency-empty span { font-size: .7rem; }
.ency-pager { display: flex; flex-wrap: wrap; justify-content: center; gap: .35rem; margin-top: 1rem; }
.ency-pager button { min-width: 2rem; min-height: 2rem; padding: .35rem .55rem; border-radius: .45rem; color: var(--ency-muted); font-size: .65rem; }
.ency-pager button:hover, .ency-pager button.is-active { border-color: var(--ency-blue); background: var(--ency-blue-deep); color: #fff; }
.ency-pager button:disabled { opacity: .38; cursor: default; }

.ency-detail {
  position: sticky;
  top: 5.35rem;
  min-width: 0;
  max-height: calc(100dvh - 6.4rem);
  overflow: auto;
  border: 1px solid var(--ency-line);
  border-radius: .9rem 1.35rem .9rem .9rem;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 1rem 2.4rem rgba(43, 72, 109, .08);
  scrollbar-color: rgba(74, 106, 146, .28) transparent;
  scrollbar-width: thin;
}
.ency-detail-empty { display: grid; min-height: 31rem; place-items: center; align-content: center; gap: .65rem; padding: 2rem; color: var(--ency-muted); text-align: center; }
.ency-detail-empty > span { display: grid; width: 3rem; height: 3rem; place-items: center; border: 1px solid var(--ency-line); border-radius: 50%; color: var(--ency-blue); font-size: 1.5rem; }
.ency-detail-empty strong { color: var(--ency-ink); font-size: 1rem; }
.ency-detail-empty p { max-width: 24rem; margin: 0; font-size: .72rem; line-height: 1.7; }
.ency-detail-visual { position: relative; display: grid; min-height: 17rem; place-items: center; overflow: hidden; border-bottom: 1px solid var(--ency-line); background: linear-gradient(145deg, #e7f0fa, #f8fbff); }
.ency-detail-visual::after { position: absolute; inset: auto -5rem -7rem auto; width: 16rem; height: 16rem; border: 1px solid rgba(68, 100, 143, .14); border-radius: 50%; content: ""; }
.ency-detail-visual img { position: relative; z-index: 1; width: min(84%, 25rem); max-height: 19rem; padding: 1.1rem; object-fit: contain; filter: drop-shadow(0 1rem 1.5rem rgba(43, 69, 100, .15)); }
.ency-detail-visual .ency-missing-image { color: var(--ency-soft); font-size: .7rem; }
.ency-detail-body { padding: 1.25rem; }
.ency-detail-eyebrow { margin: 0 0 .45rem; color: var(--ency-blue); font-size: .6rem; font-weight: 800; letter-spacing: .16em; }
.ency-detail-body h3 { margin: 0; font-size: clamp(1.65rem, 3vw, 2.45rem); line-height: 1.08; letter-spacing: -.035em; }
.ency-detail-subtitle { display: block; margin-top: .4rem; color: var(--ency-muted); font-size: .72rem; }
.ency-detail-tags { display: flex; flex-wrap: wrap; gap: .35rem; margin: .9rem 0; }
.ency-detail-tags span { padding: .35rem .5rem; border: 1px solid var(--ency-line); border-radius: .38rem; background: var(--ency-blue-pale); color: var(--ency-blue-deep); font-size: .59rem; }
.ency-copy-block, .ency-detail-section { margin-top: .9rem; padding-top: .9rem; border-top: 1px solid var(--ency-line); }
.ency-copy-block h4, .ency-detail-section h4 { margin: 0 0 .55rem; color: var(--ency-blue-deep); font-size: .75rem; }
.ency-copy-block p, .ency-detail-section p { margin: 0; color: #536981; font-size: .7rem; line-height: 1.8; white-space: pre-wrap; word-break: break-word; }
.ency-fact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem; margin-top: .85rem; }
.ency-fact-grid div { min-width: 0; padding: .65rem; border-radius: .55rem; background: #f2f7fc; }
.ency-fact-grid dt { color: var(--ency-soft); font-size: .56rem; }
.ency-fact-grid dd { margin: .22rem 0 0; overflow-wrap: anywhere; color: var(--ency-ink); font-size: .69rem; font-weight: 700; line-height: 1.45; }
.ency-data-table-wrap { width: 100%; overflow-x: auto; border: 1px solid var(--ency-line); border-radius: .55rem; }
.ency-data-table { width: 100%; min-width: 30rem; border-collapse: collapse; font-size: .65rem; }
.ency-data-table th, .ency-data-table td { padding: .62rem .7rem; border-bottom: 1px solid var(--ency-line); text-align: left; vertical-align: top; }
.ency-data-table th { background: #eaf2fb; color: var(--ency-blue-deep); font-weight: 700; }
.ency-data-table tr:last-child td { border-bottom: 0; }
.ency-data-table td { color: #536981; line-height: 1.55; }
.ency-inline-list { display: flex; flex-wrap: wrap; gap: .35rem; margin: .55rem 0 0; padding: 0; list-style: none; }
.ency-inline-list li { padding: .34rem .48rem; border: 1px solid var(--ency-line); border-radius: .4rem; background: #f7fafd; color: var(--ency-muted); font-size: .59rem; }
.ency-source-note { margin-top: 1rem; padding: .7rem; border-left: 3px solid var(--ency-gold); background: #fbf7ee; color: #756343; font-size: .62rem; line-height: 1.65; }

.ency-calculator { grid-column: 1 / -1; }
.ency-stage.is-calculator { grid-template-columns: minmax(0, 1fr); }
.ency-stage.is-calculator .ency-results-panel { min-width: 0; }
.ency-calculator-layout { display: grid; grid-template-columns: minmax(18rem, .82fr) minmax(0, 1.18fr); gap: 1rem; }
.ency-calculator-panel { padding: 1rem; border: 1px solid var(--ency-line); border-radius: .85rem; background: rgba(255, 255, 255, .82); }
.ency-calculator-panel > h3 { margin: 0; font-size: 1.05rem; }
.ency-calculator-panel > p { margin: .4rem 0 1rem; color: var(--ency-muted); font-size: .68rem; line-height: 1.65; }
.ency-choice-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .45rem; }
.ency-choice-card { display: grid; min-width: 0; grid-template-columns: 3rem minmax(0, 1fr); gap: .5rem; align-items: center; padding: .45rem; border-radius: .6rem; text-align: left; }
.ency-choice-card:hover, .ency-choice-card.is-active { border-color: var(--ency-blue); background: var(--ency-blue-pale); }
.ency-choice-card > span:first-child { display: grid; width: 3rem; height: 3rem; place-items: center; overflow: hidden; border-radius: .45rem; background: #eef3f9; color: var(--ency-soft); font-size: .52rem; text-align: center; }
.ency-choice-card img { width: 100%; height: 100%; padding: .15rem; object-fit: contain; }
.ency-choice-card strong { display: block; overflow: hidden; font-size: .67rem; text-overflow: ellipsis; white-space: nowrap; }
.ency-choice-card small { display: block; margin-top: .18rem; overflow: hidden; color: var(--ency-muted); font-size: .55rem; text-overflow: ellipsis; white-space: nowrap; }
.ency-control-group { margin-top: .9rem; }
.ency-control-group > label, .ency-control-group > strong { display: block; margin-bottom: .4rem; color: var(--ency-muted); font-size: .64rem; font-weight: 700; }
.ency-number-stepper { display: grid; grid-template-columns: 2.4rem minmax(0, 1fr) 2.4rem; gap: .35rem; }
.ency-number-stepper input { min-width: 0; width: 100%; padding: .65rem; border: 1px solid var(--ency-line); border-radius: .5rem; background: #fff; color: var(--ency-ink); text-align: center; outline: 0; }
.ency-number-stepper button { border-radius: .5rem; color: var(--ency-blue-deep); font-weight: 800; }
.ency-number-stepper button:hover { background: var(--ency-blue-pale); }
.ency-action-button { width: 100%; margin-top: .9rem; padding: .75rem 1rem; border-color: transparent; border-radius: .6rem; background: var(--ency-blue-deep); color: #fff; font-size: .72rem; font-weight: 800; }
.ency-action-button:hover { transform: translateY(-2px); background: #214677; }
.ency-result-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; }
.ency-result-summary article { padding: .85rem; border: 1px solid var(--ency-line); border-radius: .65rem; background: #f4f8fd; }
.ency-result-summary small { display: block; color: var(--ency-soft); font-size: .57rem; }
.ency-result-summary strong { display: block; margin-top: .28rem; color: var(--ency-blue-deep); font-size: 1.05rem; }
/* 指导建议列表（兴趣圈成长计算器） */
.ency-advice-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.ency-advice-item { display: flex; align-items: flex-start; gap: .5rem; padding: .65rem .75rem; border: 1px solid var(--ency-line); border-left: 3px solid var(--ency-muted); border-radius: .55rem; background: #f8fafd; }
.ency-advice-item .ency-advice-icon { flex-shrink: 0; font-size: .85rem; line-height: 1.3; }
.ency-advice-item .ency-advice-text { color: var(--ency-soft); font-size: .66rem; line-height: 1.7; }
.ency-advice-item.is-warn { border-left-color: #e08a3c; background: #fdf6ef; }
.ency-advice-item.is-warn .ency-advice-text { color: #8a5a24; }
.ency-advice-item.is-info { border-left-color: var(--ency-blue-deep); background: #eef4fc; }
.ency-advice-item.is-info .ency-advice-text { color: #2c4a72; }
.ency-advice-item.is-tip { border-left-color: #8a6db0; background: #f5f0fa; }
.ency-advice-item.is-tip .ency-advice-text { color: #5a4575; }
.ency-advice-item.is-success { border-left-color: #3a9d6e; background: #eef8f3; }
.ency-advice-item.is-success .ency-advice-text { color: #2d6b4d; }
.ency-material-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; }
.ency-material-input { display: grid; grid-template-columns: minmax(0, 1fr) 5rem; gap: .45rem; align-items: center; padding: .55rem; border: 1px solid var(--ency-line); border-radius: .55rem; background: #f7fafd; }
.ency-material-input span { min-width: 0; overflow: hidden; font-size: .64rem; text-overflow: ellipsis; white-space: nowrap; }
.ency-material-input input { min-width: 0; width: 100%; padding: .5rem; border: 1px solid var(--ency-line); border-radius: .4rem; background: #fff; text-align: center; outline: 0; }
.ency-material-input select { min-width: 0; width: 100%; padding: .5rem; border: 1px solid var(--ency-line); border-radius: .4rem; background: #fff; color: var(--ency-text); font: inherit; outline: 0; }
.ency-material-input small { display: block; margin-top: .12rem; color: var(--ency-soft); font-size: .52rem; font-weight: 500; }
.ency-calculation-list { display: grid; gap: .45rem; margin-top: .8rem; }
.ency-calculation-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: .72rem; border: 1px solid var(--ency-line); border-radius: .55rem; background: #f8fbfe; }
.ency-calculation-row strong { display: block; font-size: .69rem; }
.ency-calculation-row p { margin: .25rem 0 0; color: var(--ency-muted); font-size: .59rem; line-height: 1.55; }
.ency-calculation-row > span { flex: 0 0 auto; color: var(--ency-blue-deep); font-size: .68rem; font-weight: 800; }

.resonance-builder {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--ency-line);
  border-radius: 1.15rem;
  background:
    radial-gradient(circle at 94% 3%, rgba(149, 190, 233, .2), transparent 25rem),
    rgba(248, 251, 255, .92);
  box-shadow: 0 1.4rem 3.8rem rgba(45, 78, 118, .1);
}
.rs-panel-nav {
  position: sticky;
  z-index: 4;
  top: 4.5rem;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 1px;
  padding: 1px;
  background: var(--ency-line);
  box-shadow: 0 .55rem 1.1rem rgba(44, 72, 108, .06);
}
.rs-panel-nav button {
  display: grid;
  min-width: 0;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .55rem;
  align-items: center;
  padding: .8rem .75rem;
  border: 0;
  border-radius: 0;
  background: rgba(255, 255, 255, .9);
  text-align: left;
  transition: background .22s ease, color .22s ease, transform .22s ease;
}
.rs-panel-nav button:hover { background: #eef5fd; }
.rs-panel-nav button:active { transform: translateY(1px); }
.rs-panel-nav button.is-active { background: var(--ency-blue-deep); color: #fff; }
.rs-panel-nav small { color: var(--ency-soft); font-size: .54rem; font-weight: 800; letter-spacing: .12em; }
.rs-panel-nav button.is-active small { color: rgba(255, 255, 255, .64); }
.rs-panel-nav strong { min-width: 0; overflow: hidden; font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }
.rs-builder-layout {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr) 19rem;
  align-items: start;
}
.rs-builder-main { min-width: 0; padding: 1.2rem; }
.rs-page-section {
  min-width: 0;
  padding: 0 0 2.5rem;
  scroll-margin-top: 9.5rem;
}
.rs-page-section + .rs-page-section {
  padding-top: 2.1rem;
  border-top: 1px solid var(--ency-line);
}
.resonance-builder.is-one-page .rs-build-summary { max-height: calc(100vh - 6rem); overflow-y: auto; }
.rs-editor-section { min-width: 0; }
.rs-section-title {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1rem;
  padding-bottom: .9rem;
  border-bottom: 1px solid var(--ency-line);
}
.rs-section-title small, .rs-flow-section header small, .rs-saved-plans header small, .rs-compare header small, .rs-rotation header small, .rs-single-result header small, .rs-coefficient-picker header small {
  color: var(--ency-blue);
  font-size: .54rem;
  font-weight: 800;
  letter-spacing: .15em;
}
.rs-section-title h3 { margin: .22rem 0 0; font-size: clamp(1.18rem, 2.2vw, 1.8rem); letter-spacing: -.04em; }
.rs-section-title > p { max-width: 29rem; margin: 0; color: var(--ency-muted); font-size: .63rem; line-height: 1.65; text-align: right; text-wrap: pretty; }
.rs-hero-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .48rem;
}
.rs-selected-hero {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(12rem, .65fr) minmax(16rem, 1fr);
  gap: 1.1rem;
  margin-top: 1rem;
  overflow: hidden;
  border: 1px solid rgba(72, 105, 148, .14);
  border-radius: .9rem;
  background: linear-gradient(135deg, #e7f0fa, #fff);
}
.rs-selected-hero-art {
  display: grid;
  min-height: 20rem;
  place-items: end center;
  overflow: hidden;
  background: radial-gradient(circle at 50% 40%, #fff 0, #dbe9f7 68%, #cbdced 100%);
}
.rs-selected-hero-art img { width: 100%; height: 20rem; object-fit: contain; object-position: center bottom; }
.rs-selected-hero-copy { align-self: center; min-width: 0; padding: 1.25rem 1.25rem 1.25rem 0; }
.rs-selected-hero-copy > small { color: var(--ency-blue); font-size: .58rem; font-weight: 800; letter-spacing: .08em; }
.rs-selected-hero-copy h4 { margin: .25rem 0 .55rem; font-size: clamp(1.55rem, 3vw, 2.5rem); letter-spacing: -.06em; }
.rs-selected-hero-copy > p { margin: 0 0 1rem; color: var(--ency-muted); font-size: .68rem; line-height: 1.72; }
.rs-stepper-wrap { min-width: 0; }
.rs-stepper-wrap > label { display: block; margin-bottom: .36rem; color: var(--ency-muted); font-size: .59rem; font-weight: 700; line-height: 1.4; }
.rs-warning, .rs-notice {
  display: grid;
  gap: .18rem;
  margin-top: .85rem;
  padding: .72rem .8rem;
  border-left: 3px solid var(--ency-gold);
  background: #fbf7ed;
  color: #766444;
}
.rs-warning strong, .rs-notice { font-size: .64rem; font-weight: 800; }
.rs-warning span { font-size: .59rem; line-height: 1.62; }
.rs-gear-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin-bottom: .9rem;
}
.rs-gear-tabs button {
  flex: 1 1 5.2rem;
  min-width: 5.2rem;
  padding: .62rem .72rem;
  border: 1px solid var(--ency-line);
  border-radius: .52rem;
  background: rgba(255, 255, 255, .85);
  color: var(--ency-muted);
  font-size: .62rem;
  font-weight: 700;
}
.rs-gear-tabs button:hover, .rs-gear-tabs button.is-active { border-color: var(--ency-blue); background: var(--ency-blue-pale); color: var(--ency-blue-deep); }
.rs-choice-gallery {
  display: grid;
  min-width: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .45rem;
}
.rs-choice-gallery-dense { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rs-inline-config {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(11rem, .6fr);
  gap: .75rem;
  align-items: center;
  margin-top: .8rem;
  padding: .75rem;
  border: 1px solid var(--ency-line);
  border-radius: .72rem;
  background: #f2f7fc;
}
.rs-equipped-item {
  display: grid;
  min-width: 0;
  grid-template-columns: 4.4rem minmax(0, 1fr);
  gap: .7rem;
  align-items: center;
}
.rs-equipped-item > span { display: grid; width: 4.4rem; height: 4.4rem; place-items: center; border-radius: .55rem; background: #fff; }
.rs-equipped-item img { width: 100%; height: 100%; padding: .25rem; object-fit: contain; }
.rs-equipped-item small { color: var(--ency-soft); font-size: .55rem; }
.rs-equipped-item strong { display: block; margin-top: .12rem; font-size: .75rem; }
.rs-equipped-item p { margin: .22rem 0 0; overflow: hidden; color: var(--ency-muted); font-size: .57rem; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }
.rs-slot-status {
  display: flex;
  align-items: center;
  gap: .7rem;
  margin-bottom: .7rem;
  padding: .65rem .75rem;
  border: 1px solid var(--ency-line);
  border-radius: .58rem;
  background: #f2f7fc;
}
.rs-slot-status strong { font-size: .72rem; }
.rs-slot-status span { min-width: 0; flex: 1; color: var(--ency-muted); font-size: .59rem; }
.rs-slot-status button { flex: 0 0 auto; padding: .4rem .6rem; border-radius: .42rem; font-size: .57rem; }
.rs-slot-status button:disabled { opacity: .38; }
.rs-inscription-group {
  margin-top: .8rem;
  padding: .8rem;
  border: 1px solid var(--ency-line);
  border-radius: .8rem;
  background: rgba(255, 255, 255, .7);
}
.rs-inscription-group > header {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: .65rem;
}
.rs-inscription-group > header > span {
  display: grid;
  width: 2.25rem;
  height: 2.25rem;
  place-items: center;
  border-radius: .55rem;
  color: #fff;
  font-size: .7rem;
  font-weight: 900;
}
.rs-color-red > header > span { background: #a75454; }
.rs-color-green > header > span { background: #4f8975; }
.rs-color-blue > header > span { background: #4b6eaa; }
.rs-inscription-group header strong { display: block; font-size: .73rem; }
.rs-inscription-group header small { display: block; margin-top: .1rem; color: var(--ency-muted); font-size: .55rem; }
.rs-double-stepper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; margin-top: .7rem; }
.rs-compatibility { margin-top: .55rem; color: #8a6952; font-size: .57rem; line-height: 1.5; }
.rs-compatibility.is-compatible { color: #3f765f; }
.rs-attribute-ledger { margin-top: 1rem; }
.rs-attribute-ledger h4 { margin: 0 0 .55rem; font-size: .78rem; }
.rs-empty-inline { padding: 1rem; border: 1px dashed var(--ency-line-strong); border-radius: .65rem; color: var(--ency-muted); font-size: .62rem; line-height: 1.65; text-align: center; }
.rs-skill-list { display: grid; gap: .5rem; }
.rs-skill-row {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr) 12rem;
  gap: .75rem;
  align-items: center;
  padding: .62rem;
  border: 1px solid var(--ency-line);
  border-radius: .65rem;
  background: rgba(255, 255, 255, .76);
}
.rs-skill-row.is-active { border-color: rgba(63, 109, 168, .46); background: #eef5fc; }
.rs-skill-identity {
  display: grid;
  min-width: 0;
  grid-template-columns: 3.7rem minmax(0, 1fr);
  gap: .65rem;
  align-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
}
.rs-skill-identity > span:first-child, .rs-rotation-list article > span:first-child {
  display: grid;
  width: 3.7rem;
  height: 3.7rem;
  place-items: center;
  overflow: hidden;
  border-radius: .55rem;
  background: #e2ecf7;
}
.rs-skill-identity img, .rs-rotation-list img { width: 100%; height: 100%; padding: .18rem; object-fit: contain; }
.rs-skill-identity small { display: block; color: var(--ency-soft); font-size: .54rem; }
.rs-skill-identity strong { display: block; margin-top: .12rem; font-size: .72rem; }
.rs-skill-identity em { display: block; margin-top: .16rem; color: var(--ency-blue); font-size: .54rem; font-style: normal; }
.rs-coefficient-picker, .rs-flow-section, .rs-single-result, .rs-rotation, .rs-saved-plans, .rs-compare {
  margin-top: 1rem;
  padding: .85rem;
  border: 1px solid var(--ency-line);
  border-radius: .78rem;
  background: rgba(255, 255, 255, .72);
}
.rs-coefficient-picker > header, .rs-flow-section > header, .rs-single-result > header, .rs-rotation > header, .rs-saved-plans > header, .rs-compare > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .65rem;
}
.rs-coefficient-picker h4, .rs-flow-section h4, .rs-single-result h4, .rs-rotation h4, .rs-saved-plans h4, .rs-compare h4 { margin: .15rem 0 0; font-size: .85rem; }
.rs-coefficient-picker header > span, .rs-flow-section header > span, .rs-single-result header > span, .rs-rotation header > span, .rs-saved-plans header > span { color: var(--ency-muted); font-size: .57rem; }
.rs-coefficient-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .42rem; }
.rs-coefficient-options button {
  display: grid;
  min-width: 0;
  gap: .12rem;
  padding: .65rem;
  border: 1px solid var(--ency-line);
  border-radius: .55rem;
  background: #f8fbfe;
  text-align: left;
}
.rs-coefficient-options button:hover, .rs-coefficient-options button.is-active { border-color: var(--ency-blue); background: var(--ency-blue-pale); }
.rs-coefficient-options small { overflow: hidden; color: var(--ency-muted); font-size: .55rem; text-overflow: ellipsis; white-space: nowrap; }
.rs-coefficient-options strong { color: var(--ency-blue-deep); font-size: .82rem; }
.rs-coefficient-options em { color: var(--ency-soft); font-size: .5rem; font-style: normal; }
.rs-flow-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .48rem; }
.rs-flow-card {
  display: grid;
  min-width: 0;
  grid-template-columns: 3.25rem minmax(0, 1fr);
  gap: .6rem;
  align-items: start;
  padding: .6rem;
  border: 1px solid var(--ency-line);
  border-radius: .62rem;
  background: #f8fbfe;
  text-align: left;
}
.rs-flow-card:hover, .rs-flow-card.is-active { border-color: var(--ency-blue); background: var(--ency-blue-pale); }
.rs-flow-icon { display: grid; width: 3.25rem; height: 3.25rem; place-items: center; overflow: hidden; border-radius: .5rem; background: #e4edf7; }
.rs-flow-icon img { width: 100%; height: 100%; padding: .15rem; object-fit: contain; }
.rs-flow-card small { display: block; color: var(--ency-soft); font-size: .52rem; }
.rs-flow-card strong { display: block; margin-top: .12rem; font-size: .67rem; }
.rs-flow-card p { display: -webkit-box; margin: .2rem 0 0; overflow: hidden; color: var(--ency-muted); font-size: .55rem; line-height: 1.52; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.rs-target-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
.rs-formula {
  margin-top: .8rem;
  padding: .78rem;
  border: 1px solid rgba(62, 110, 169, .2);
  border-radius: .65rem;
  background: #edf5fd;
}
.rs-formula > small { display: block; color: var(--ency-blue); font-size: .54rem; font-weight: 800; letter-spacing: .08em; }
.rs-formula code { display: block; margin-top: .3rem; overflow-wrap: anywhere; color: var(--ency-blue-deep); font-family: Consolas, monospace; font-size: .65rem; font-weight: 700; line-height: 1.6; }
.rs-formula p { margin: .35rem 0 0; color: var(--ency-muted); font-size: .57rem; line-height: 1.6; }
.rs-rotation-list { display: grid; gap: .42rem; }
.rs-rotation-list article {
  display: grid;
  min-width: 0;
  grid-template-columns: 3rem minmax(0, 1fr) 10rem;
  gap: .6rem;
  align-items: center;
  padding: .5rem;
  border: 1px solid var(--ency-line);
  border-radius: .55rem;
  background: #f8fbfe;
}
.rs-rotation-list article > span:first-child { width: 3rem; height: 3rem; }
.rs-rotation-list strong { display: block; font-size: .66rem; }
.rs-rotation-list small { display: block; margin-top: .12rem; color: var(--ency-muted); font-size: .53rem; }
.rs-plan-actions {
  display: grid;
  grid-template-columns: minmax(13rem, .7fr) minmax(0, 1.3fr);
  gap: .7rem;
  align-items: end;
  padding: .8rem;
  border: 1px solid var(--ency-line);
  border-radius: .7rem;
  background: #f2f7fc;
}
.rs-plan-actions label, .rs-import-box label { display: grid; gap: .3rem; color: var(--ency-muted); font-size: .58rem; font-weight: 700; }
.rs-plan-actions input, .rs-import-box textarea {
  min-width: 0;
  width: 100%;
  padding: .68rem .72rem;
  border: 1px solid var(--ency-line);
  border-radius: .5rem;
  background: #fff;
  color: var(--ency-ink);
  outline: 0;
  resize: vertical;
}
.rs-plan-actions > div { display: flex; flex-wrap: wrap; gap: .42rem; }
.rs-plan-actions button, .rs-import-box button, .rs-compare button {
  padding: .62rem .75rem;
  border-radius: .5rem;
  font-size: .6rem;
  font-weight: 750;
}
.rs-plan-actions .rs-primary-action { border-color: var(--ency-blue-deep); background: var(--ency-blue-deep); color: #fff; }
.rs-import-box {
  display: grid;
  gap: .48rem;
  margin-top: .75rem;
  padding: .8rem;
  border: 1px solid var(--ency-line);
  border-radius: .7rem;
  background: rgba(255, 255, 255, .72);
}
.rs-import-box button { justify-self: start; }
.rs-plan-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.rs-plan-grid article { min-width: 0; padding: .7rem; border: 1px solid var(--ency-line); border-radius: .58rem; background: #f8fbfe; }
.rs-plan-grid article.is-comparing { border-color: var(--ency-blue); background: var(--ency-blue-pale); }
.rs-plan-grid article > small { display: block; color: var(--ency-soft); font-size: .51rem; }
.rs-plan-grid article > strong { display: block; margin-top: .22rem; overflow: hidden; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.rs-plan-grid article > p { margin: .2rem 0 .55rem; color: var(--ency-muted); font-size: .55rem; }
.rs-plan-grid article > div { display: flex; flex-wrap: wrap; gap: .32rem; }
.rs-plan-grid button { padding: .38rem .5rem; border-radius: .38rem; font-size: .54rem; }
.rs-build-summary {
  position: sticky;
  top: 5.2rem;
  min-width: 0;
  padding: 1rem;
  border-left: 1px solid var(--ency-line);
  background: rgba(235, 244, 253, .82);
}
.rs-build-summary > header {
  display: grid;
  min-height: 7.2rem;
  grid-template-columns: minmax(0, 1fr) 6.5rem;
  gap: .4rem;
  align-items: center;
  overflow: hidden;
  border-bottom: 1px solid var(--ency-line);
}
.rs-build-summary header small { color: var(--ency-blue); font-size: .52rem; font-weight: 800; letter-spacing: .14em; }
.rs-build-summary header h3 { margin: .2rem 0 0; font-size: 1.4rem; letter-spacing: -.05em; }
.rs-build-summary header p { margin: .24rem 0 0; color: var(--ency-muted); font-size: .57rem; }
.rs-summary-hero { display: grid; width: 6.5rem; height: 7.2rem; place-items: end center; overflow: hidden; }
.rs-summary-hero img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.rs-build-summary dl { display: grid; gap: 1px; margin: .8rem 0 0; overflow: hidden; border: 1px solid var(--ency-line); border-radius: .55rem; background: var(--ency-line); }
.rs-build-summary dl div { display: grid; grid-template-columns: 4.3rem minmax(0, 1fr); gap: .45rem; padding: .52rem; background: rgba(255, 255, 255, .8); }
.rs-build-summary dt { color: var(--ency-soft); font-size: .55rem; }
.rs-build-summary dd { min-width: 0; margin: 0; overflow: hidden; font-size: .58rem; font-weight: 700; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.rs-summary-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .35rem; margin-top: .65rem; }
.rs-summary-stats article { min-width: 0; padding: .55rem .4rem; border: 1px solid var(--ency-line); border-radius: .5rem; background: rgba(255, 255, 255, .78); }
.rs-summary-stats small { display: block; overflow: hidden; color: var(--ency-soft); font-size: .49rem; text-overflow: ellipsis; white-space: nowrap; }
.rs-summary-stats strong { display: block; margin-top: .18rem; overflow: hidden; color: var(--ency-blue-deep); font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.rs-summary-coverage { display: grid; grid-template-columns: .55rem minmax(0, 1fr); gap: .5rem; align-items: start; margin-top: .7rem; }
.rs-summary-coverage > span { width: .55rem; height: .55rem; margin-top: .15rem; border-radius: 50%; background: var(--ency-gold); box-shadow: 0 0 0 .2rem rgba(169, 134, 78, .12); }
.rs-summary-coverage > span.is-ready { background: #4f8975; box-shadow: 0 0 0 .2rem rgba(79, 137, 117, .12); }
.rs-summary-coverage p { margin: 0; color: var(--ency-muted); font-size: .54rem; line-height: 1.55; }
.rs-summary-coverage strong { display: block; color: var(--ency-ink); font-size: .58rem; }
.rs-next-step { display: flex; width: 100%; align-items: center; justify-content: space-between; margin-top: .8rem; padding: .68rem .75rem; border: 0; border-radius: .52rem; background: var(--ency-blue-deep); color: #fff; font-size: .62rem; font-weight: 750; }
.rs-next-step:hover { transform: translateY(-1px); background: #214677; }

.ency-integrity {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: 3rem;
  margin-bottom: 5rem;
  padding: 2.4rem;
  border: 1px solid var(--ency-line);
  border-radius: 1rem 2rem 1rem 1rem;
  background: linear-gradient(135deg, rgba(224, 235, 247, .88), rgba(255, 255, 255, .8));
}
.ency-integrity h2 { font-size: clamp(1.9rem, 3.3vw, 3.25rem); }
.ency-integrity ol { display: grid; gap: 1px; margin: 0; padding: 0; overflow: hidden; border: 1px solid var(--ency-line); border-radius: .7rem; background: var(--ency-line); list-style: none; }
.ency-integrity li { display: grid; grid-template-columns: 2.3rem minmax(0, 1fr); gap: .7rem; align-items: start; padding: .9rem; background: rgba(255, 255, 255, .8); }
.ency-integrity li > b { color: var(--ency-blue); font-size: .8rem; }
.ency-integrity li span { color: var(--ency-muted); font-size: .68rem; line-height: 1.65; }
.ency-integrity li strong { display: block; margin-bottom: .16rem; color: var(--ency-ink); font-size: .72rem; }
.ency-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.6rem max(1.5rem, calc((100vw - 86rem) / 2)) calc(1.6rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--ency-line); color: var(--ency-muted); font-size: .65rem; }
.ency-footer nav { display: flex; gap: 1rem; }
.ency-footer a { text-decoration: none; }
.ency-footer a:hover { color: var(--ency-blue-deep); }

button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid rgba(65, 115, 175, .34); outline-offset: 2px; }
[hidden] { display: none !important; }

@media (max-width: 72rem) {
  .ency-mode-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ency-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ency-choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rs-builder-layout { grid-template-columns: minmax(0, 1fr) 17rem; }
  .rs-hero-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rs-choice-gallery-dense { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 56rem) {
  .ency-topbar { padding: 0 1rem; }
  .ency-topbar nav { gap: .85rem; }
  .ency-source-summary { right: 1.5rem; left: 1.5rem; }
  .ency-source-summary div { min-width: 0; flex: 1; }
  .ency-stage { grid-template-columns: 1fr; }
  .ency-detail { position: relative; top: auto; max-height: none; }
  .ency-detail-empty { min-height: 16rem; }
  .ency-calculator-layout, .ency-integrity { grid-template-columns: 1fr; }
  .rs-panel-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rs-builder-layout { grid-template-columns: 1fr; }
  .rs-build-summary { position: relative; top: auto; max-height: none !important; overflow: visible !important; border-top: 1px solid var(--ency-line); border-left: 0; }
  .rs-build-summary > header { grid-template-columns: minmax(0, 1fr) 8rem; }
  .rs-summary-hero { width: 8rem; }
}

@media (max-width: 40rem) {
  .ency-topbar { display: grid; width: 100%; min-height: 3.8rem; grid-template-columns: 2rem minmax(0, 1fr); gap: .3rem; padding: 0 .45rem; overflow: hidden; }
  .ency-brand { flex: 0 0 2rem; gap: 0; }
  .ency-brand-mark { width: 2rem; height: 2rem; }
  .ency-brand > span:last-child { display: none; }
  .ency-topbar nav { display: grid; width: 100%; min-width: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
  .ency-topbar nav a { min-width: 0; padding: 0; font-size: .55rem; text-align: center; white-space: nowrap; }
  .ency-topbar nav a:first-child { display: none; }
  .ency-hero { min-height: 43rem; }
  .ency-hero picture img { object-fit: contain; object-position: center top; background: #d9e5f5; }
  .ency-hero-wash { background: linear-gradient(180deg, rgba(242, 248, 255, .04) 0, rgba(244, 249, 255, .18) 43%, rgba(246, 251, 255, .95) 62%, #f6fbff 100%); }
  .ency-hero-copy { position: absolute; right: 0; bottom: 0; left: 0; width: 100%; padding: 0 1.15rem 2rem; }
  .ency-hero h1 { max-width: 100%; font-size: clamp(2.2rem, 10.5vw, 2.7rem); letter-spacing: -.07em; text-wrap: wrap; }
  .ency-hero-copy > strong { margin-top: 1rem; font-size: .95rem; }
  .ency-hero-copy > span { font-size: .74rem; line-height: 1.7; }
  .ency-source-summary { top: .9rem; right: 1rem; bottom: auto; left: 1rem; }
  .ency-source-summary div { padding: .65rem .55rem; text-align: center; }
  .ency-source-summary dt { font-size: .92rem; }
  .ency-source-summary dd { font-size: .52rem; }
  .ency-command, .ency-workspace, .ency-integrity { width: min(100% - 1.25rem, 36rem); }
  .ency-command { padding-top: 3.6rem; }
  .ency-section-heading { align-items: start; flex-direction: column; gap: .7rem; }
  .ency-section-heading h2, .ency-workspace-header h2 { max-width: 100%; font-size: clamp(1.72rem, 8vw, 2.15rem); overflow-wrap: anywhere; text-wrap: wrap; }
  .ency-section-heading > span { text-align: left; }
  .ency-mode-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem; padding: .3rem; }
  .ency-mode-categories button { padding: .62rem .7rem; }
  .ency-mode-categories small { white-space: normal; }
  .ency-mode-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ency-mode-card { min-height: 7rem; }
  .ency-workspace { margin-top: 1rem; margin-bottom: 3.5rem; padding: .65rem; border-radius: 1rem; }
  .ency-workspace-header { align-items: start; padding: .5rem .25rem 1rem; }
  .ency-workspace-count strong { font-size: 1.4rem; }
  .ency-toolbar { grid-template-columns: 1fr; }
  .ency-toolbar > button { min-height: 2.45rem; }
  .ency-filter-group { grid-template-columns: 1fr; gap: .15rem; }
  .ency-filter-group > strong { padding-bottom: .1rem; }
  .ency-results { grid-template-columns: 1fr; }
  .ency-result-card { min-height: 5.7rem; grid-template-columns: 4rem minmax(0, 1fr); }
  .ency-result-media { width: 4rem; height: 4rem; }
  .ency-detail-visual { min-height: 15rem; }
  .ency-detail-body { padding: 1rem; }
  .ency-fact-grid { grid-template-columns: 1fr; }
  .ency-calculator-layout { gap: .65rem; }
  .ency-choice-grid { grid-template-columns: 1fr; }
  .ency-material-grid, .ency-result-summary { grid-template-columns: 1fr; }
  .rs-panel-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rs-panel-nav { top: 3.8rem; }
  .rs-panel-nav button { padding: .68rem .58rem; }
  .rs-builder-main { padding: .8rem; }
  .rs-section-title { align-items: start; flex-direction: column; gap: .45rem; }
  .rs-section-title > p { max-width: none; text-align: left; }
  .rs-hero-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rs-selected-hero { grid-template-columns: 1fr; }
  .rs-selected-hero-art { min-height: 17rem; }
  .rs-selected-hero-art img { height: 17rem; }
  .rs-selected-hero-copy { padding: .2rem .85rem 1rem; }
  .rs-choice-gallery, .rs-choice-gallery-dense { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rs-inline-config { grid-template-columns: 1fr; }
  .rs-slot-status { align-items: flex-start; flex-wrap: wrap; }
  .rs-slot-status span { flex-basis: calc(100% - 4rem); }
  .rs-double-stepper { grid-template-columns: 1fr; }
  .rs-skill-row { grid-template-columns: 1fr; }
  .rs-coefficient-options, .rs-flow-grid, .rs-target-grid { grid-template-columns: 1fr; }
  .rs-flow-card p { -webkit-line-clamp: 4; }
  .rs-rotation-list article { grid-template-columns: 3rem minmax(0, 1fr); }
  .rs-rotation-list article .rs-stepper-wrap { grid-column: 1 / -1; }
  .rs-plan-actions, .rs-plan-grid { grid-template-columns: 1fr; }
  .rs-build-summary { padding: .85rem; }
  .rs-build-summary > header { min-height: 6.5rem; grid-template-columns: minmax(0, 1fr) 6.5rem; }
  .rs-summary-hero { width: 6.5rem; height: 6.5rem; }
  .rs-summary-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ency-integrity { gap: 1.4rem; margin-bottom: 3rem; padding: 1.25rem; }
  .ency-footer { align-items: flex-start; flex-direction: column; }
}

/* Local combat archive: summons, equipment sets and Wanxiang flows */
.summon-flow-trait,
.equipment-set-trait,
.wanxiang-effect {
  margin: 1rem 0;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(87, 128, 179, .22);
  border-left: .24rem solid #5f92cb;
  border-radius: .7rem;
  background: rgba(222, 237, 252, .62);
  color: #274563;
  line-height: 1.75;
}
.summon-skill-card,
.summon-mystery-card {
  border: 1px solid rgba(91, 128, 174, .2);
  border-radius: .85rem;
  background: rgba(255, 255, 255, .72);
  overflow: hidden;
}
.summon-skill-card > header,
.summon-mystery-card > header {
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: .9rem 1rem;
  border-bottom: 1px solid rgba(91, 128, 174, .14);
}
.summon-skill-card > header img,
.summon-mystery-icon {
  width: 3.2rem;
  height: 3.2rem;
  padding: .28rem;
  border-radius: 50%;
  background: #4f7faf;
  object-fit: contain;
}
.summon-level-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .35rem;
  padding: .85rem 1rem 0;
}
.summon-level-grid button {
  min-height: 2.35rem;
  border: 1px solid rgba(82, 126, 179, .18);
  border-radius: .45rem;
  background: #e9f1fb;
  color: #526b88;
  cursor: pointer;
}
.summon-level-grid button.is-active {
  border-color: #e7ab46;
  background: #f3bd61;
  color: #fff;
}
.summon-level-result {
  margin: .85rem 1rem 1rem;
  padding: 1rem;
  border-radius: .65rem;
  background: #edf4fc;
  color: #243d5a;
  line-height: 1.8;
  white-space: pre-wrap;
}
.summon-mystery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
  margin-top: .8rem;
}
.summon-mystery-card > p,
.summon-mystery-card > footer { margin: 0; padding: .8rem 1rem; line-height: 1.7; }
.summon-mystery-card > footer { border-top: 1px solid rgba(91, 128, 174, .12); color: #6b7f97; }
.equipment-set-levels {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .5rem;
  margin: .8rem 0 1.1rem;
}
.equipment-set-levels article {
  padding: .9rem;
  border-radius: .7rem;
  background: #edf4fc;
}
.equipment-set-levels strong { display: block; margin-bottom: .35rem; color: #b87e21; }
.equipment-piece-table { width: 100%; border-collapse: collapse; font-size: .83rem; }
.equipment-piece-table th,
.equipment-piece-table td { padding: .7rem .55rem; border-bottom: 1px solid rgba(88, 124, 165, .16); text-align: left; vertical-align: middle; }
.equipment-piece-name { display: flex; align-items: center; gap: .6rem; min-width: 10rem; }
.equipment-piece-name img { width: 2.8rem; height: 2.8rem; border-radius: .55rem; background: #d9e7f6; object-fit: contain; }
.equipment-piece-scroll { overflow-x: auto; }
.wanxiang-visual { display: grid; place-items: center; min-height: 12rem; border-radius: .9rem; background: linear-gradient(145deg, #4e88ba, #99cdea); }
.wanxiang-visual img { width: min(9rem, 55%); aspect-ratio: 1; object-fit: contain; }

@media (max-width: 40rem) {
  .summon-level-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .summon-mystery-grid,
  .equipment-set-levels { grid-template-columns: 1fr; }
  .summon-skill-card > header,
  .summon-mystery-card > header { align-items: flex-start; }
  .equipment-piece-table { min-width: 42rem; }
}

/* Calculator layout follows the reference workflow while retaining the community palette. */
.rs-reference-appbar {
  display: grid;
  grid-template-columns: minmax(12rem, 1fr) auto;
  gap: 1rem;
  align-items: center;
  padding: .75rem 1rem;
  border-bottom: 1px solid var(--ency-line);
  background: rgba(247, 251, 255, .96);
}
.rs-reference-title,
.rs-reference-plan,
.rs-reference-plan > span { display: flex; align-items: center; }
.rs-reference-title { gap: .6rem; }
.rs-reference-title > span { font-size: 1.6rem; color: var(--ency-blue); }
.rs-reference-title div,
.rs-reference-plan > span { display: grid; }
.rs-reference-title small,
.rs-reference-plan small { color: var(--ency-soft); font-size: .52rem; letter-spacing: .08em; }
.rs-reference-title strong { font-size: .92rem; }
.rs-reference-plan { gap: .45rem; }
.rs-reference-plan > span { min-width: 9rem; margin-right: .25rem; }
.rs-reference-plan strong { max-width: 14rem; overflow: hidden; font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.rs-reference-plan button { padding: .48rem .66rem; border: 1px solid var(--ency-line); border-radius: .5rem; background: #fff; color: var(--ency-blue-deep); font-size: .58rem; }
.rs-hero-switcher { display: block; margin-bottom: .75rem; }
.rs-hero-switcher > button { border: 1px solid var(--ency-line); border-radius: .62rem; background: #f8fbfe; color: var(--ency-blue-deep); }
.rs-hero-switcher > button:first-child,
.rs-hero-switcher > button:last-child { font-size: 1.5rem; }
.rs-hero-current { display: grid; min-width: 0; grid-template-columns: 3.2rem minmax(0, 1fr) auto; gap: .65rem; align-items: center; padding: .3rem .65rem .3rem .3rem; text-align: left; }
.rs-hero-current { width: 100%; }
.rs-hero-current > span:first-child { display: grid; width: 3.2rem; height: 3.2rem; place-items: end center; overflow: hidden; border-radius: .45rem; background: #e5eff9; }
.rs-hero-current img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.rs-hero-current small { display: block; color: var(--ency-soft); font-size: .52rem; }
.rs-hero-current strong { display: block; margin-top: .12rem; font-size: .75rem; }
.rs-hero-current em { color: var(--ency-blue); font-size: .56rem; font-style: normal; }
.rs-hero-picker { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .35rem; margin: 0 0 .8rem; padding: .65rem; border: 1px solid var(--ency-line); border-radius: .75rem; background: #f4f8fd; }
.rs-hero-pick { display: grid; min-width: 0; justify-items: center; padding: .4rem .25rem; border: 1px solid transparent; border-radius: .55rem; background: rgba(255,255,255,.78); text-align: center; }
.rs-hero-pick:hover,
.rs-hero-pick.is-active { border-color: var(--ency-blue); background: #e5f1fb; }
.rs-hero-pick > span { display: grid; width: 2.8rem; height: 2.8rem; place-items: end center; overflow: hidden; }
.rs-hero-pick img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.rs-hero-pick strong { max-width: 100%; margin-top: .2rem; overflow: hidden; font-size: .55rem; text-overflow: ellipsis; white-space: nowrap; }
.rs-hero-pick small { max-width: 100%; margin-top: .08rem; overflow: hidden; color: var(--ency-soft); font-size: .43rem; text-overflow: ellipsis; white-space: nowrap; }
.rs-reference-hero-stage {
  display: grid;
  min-height: 18rem;
  grid-template-columns: minmax(16rem, 1.1fr) minmax(14rem, .9fr);
  overflow: hidden;
  border: 1px solid rgba(79, 122, 173, .16);
  border-radius: 1rem 1rem .35rem .35rem;
  background: radial-gradient(circle at 20% 30%, rgba(255,255,255,.92), transparent 36%), linear-gradient(145deg, #dae9f8, #f8f4ef 58%, #dceced);
}
.rs-reference-hero-stage .rs-selected-hero-art { min-height: 18rem; background: transparent; }
.rs-reference-hero-stage .rs-selected-hero-art img { height: 18rem; }
.rs-reference-hero-copy { align-self: center; padding: 2rem 2rem 2rem .5rem; }
.rs-reference-hero-copy > small { color: #78a4cc; font-size: .56rem; letter-spacing: .14em; }
.rs-reference-hero-copy h4 { margin: .25rem 0; font-family: Georgia, 'Noto Serif SC', serif; font-size: clamp(2.2rem, 5vw, 4.5rem); font-weight: 500; letter-spacing: -.08em; }
.rs-reference-hero-copy > strong { color: var(--ency-blue); font-size: .72rem; }
.rs-reference-hero-copy p { max-width: 34rem; margin: 1rem 0 0; color: var(--ency-muted); font-size: .66rem; line-height: 1.75; }
.rs-reference-config { display: grid; grid-template-columns: minmax(8rem, .38fr) minmax(14rem, 1fr); gap: 1px; margin-top: 1px; background: var(--ency-line); }
.rs-reference-config > article,
.rs-reference-config > div { padding: .85rem 1rem; background: rgba(255,255,255,.9); }
.rs-reference-config article small,
.rs-reference-config article span { display: block; color: var(--ency-soft); font-size: .52rem; }
.rs-reference-config article strong { display: block; margin: .2rem 0; color: var(--ency-gold); font-size: 1.25rem; font-variant-numeric: tabular-nums; }
.rs-reference-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin-top: 1px; background: var(--ency-line); }
.rs-reference-stat-grid article { padding: .75rem .8rem; background: #f7fbff; }
.rs-reference-stat-grid small { display: block; color: var(--ency-soft); font-size: .52rem; }
.rs-reference-stat-grid strong { display: block; margin-top: .2rem; font-size: .9rem; font-variant-numeric: tabular-nums; }
.rs-hero-position { margin-top: .45rem; color: var(--ency-soft); font-size: .52rem; text-align: right; }
.rs-gear-tabs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.rs-gear-tabs button { min-width: 0; }
.rs-set-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.rs-set-choice { display: grid; min-width: 0; grid-template-columns: 4.6rem minmax(0, 1fr); gap: .75rem; padding: .65rem; border: 1px solid var(--ency-line); border-radius: .72rem; background: rgba(255,255,255,.86); text-align: left; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.rs-set-choice:hover { transform: translateY(-2px); border-color: #7ea7cf; }
.rs-set-choice:active { transform: translateY(0); }
.rs-set-choice.is-active { border-color: var(--ency-blue); background: #e8f3fd; box-shadow: inset 3px 0 0 var(--ency-blue); }
.rs-set-choice > span:first-child { display: grid; width: 4.6rem; height: 4.6rem; place-items: center; overflow: hidden; border-radius: .55rem; background: #dfeaf6; }
.rs-set-choice img { width: 100%; height: 100%; object-fit: contain; }
.rs-set-choice small { color: var(--ency-blue); font-size: .52rem; }
.rs-set-choice strong { display: block; margin: .2rem 0; font-size: .75rem; }
.rs-set-choice p { margin: 0; display: -webkit-box; overflow: hidden; color: var(--ency-muted); font-size: .56rem; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.rs-mix-slot-nav { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: .35rem; margin-bottom: .65rem; }
.rs-mix-slot-nav button { display: grid; gap: .1rem; padding: .55rem; border: 1px solid var(--ency-line); border-radius: .5rem; background: #fff; }
.rs-mix-slot-nav button.is-active { border-color: var(--ency-blue); background: var(--ency-blue-pale); }
.rs-mix-slot-nav span { font-size: .62rem; font-weight: 700; }
.rs-mix-slot-nav small { color: var(--ency-soft); font-size: .48rem; }
.rs-flow-explainer { margin-bottom: .65rem; padding: .75rem .85rem; border-left: 3px solid var(--ency-blue); background: #eef6fd; }
.rs-flow-explainer strong { font-size: .68rem; }
.rs-flow-explainer p { margin: .22rem 0 0; color: var(--ency-muted); font-size: .55rem; line-height: 1.6; }
.rs-equipment-flow-list { display: grid; gap: .48rem; }
.rs-equipment-flow-row { overflow: hidden; border: 1px solid var(--ency-line); border-radius: .7rem; background: #fff; }
.rs-equipment-flow-row.has-flow { border-color: #8fb4d7; }
.rs-equipment-flow-row > header { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr) auto; gap: .65rem; align-items: center; padding: .55rem; }
.rs-equipment-flow-item { display: grid; width: 3.2rem; height: 3.2rem; place-items: center; overflow: hidden; border-radius: .5rem; background: #e5eef8; }
.rs-equipment-flow-item img { width: 100%; height: 100%; object-fit: contain; }
.rs-equipment-flow-item i { font-size: .9rem; font-style: normal; }
.rs-equipment-flow-row header small,
.rs-equipment-flow-row header strong,
.rs-equipment-flow-row header em { display: block; min-width: 0; }
.rs-equipment-flow-row header small { color: var(--ency-soft); font-size: .48rem; }
.rs-equipment-flow-row header strong { margin-top: .1rem; font-size: .65rem; }
.rs-equipment-flow-row header em { margin-top: .12rem; overflow: hidden; color: var(--ency-muted); font-size: .52rem; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.rs-equipment-flow-row header button { padding: .42rem .58rem; border: 1px solid var(--ency-line); border-radius: .45rem; background: #f4f8fc; font-size: .54rem; }
.rs-equipment-flow-row header button:disabled { opacity: .38; }
.rs-equipment-flow-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem; padding: .55rem; border-top: 1px solid var(--ency-line); background: #f4f8fc; }
.rs-equipment-flow-options > button { display: grid; min-width: 0; grid-template-columns: auto minmax(0,1fr); gap: .5rem; padding: .52rem; border: 1px solid transparent; border-radius: .55rem; background: #fff; text-align: left; }
.rs-equipment-flow-options > button:hover,
.rs-equipment-flow-options > button.is-active { border-color: var(--ency-blue); background: #e6f2fc; }
.rs-equipment-flow-options > button > span:first-child { display: grid; width: 2.2rem; height: 2.2rem; place-items: center; }
.rs-equipment-flow-options img { max-width: 100%; max-height: 100%; object-fit: contain; }
.rs-equipment-flow-options small { color: var(--ency-soft); font-size: .45rem; }
.rs-equipment-flow-options strong { display: block; margin: .1rem 0; font-size: .61rem; }
.rs-equipment-flow-options p { margin: 0; color: var(--ency-muted); font-size: .5rem; line-height: 1.5; }
.rs-filter-shell { min-width: 0; }
.rs-filter-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(8rem, .35fr); gap: .45rem; margin-bottom: .55rem; }
.rs-filter-toolbar label { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: .45rem; min-width: 0; padding: .25rem .45rem; border: 1px solid var(--ency-line); border-radius: .5rem; background: #fff; }
.rs-filter-toolbar label > span { color: var(--ency-soft); font-size: .5rem; }
.rs-filter-toolbar input,
.rs-filter-toolbar select { min-width: 0; width: 100%; padding: .35rem; border: 0; outline: 0; background: transparent; color: var(--ency-ink); font-size: .58rem; }
.rs-filter-toolbar label:focus-within { border-color: var(--ency-blue); box-shadow: 0 0 0 2px rgba(67, 116, 171, .1); }
.rs-filter-shell > footer { display: flex; align-items: center; justify-content: space-between; gap: .7rem; margin-top: .55rem; padding-top: .45rem; border-top: 1px solid var(--ency-line); }
.rs-filter-shell > footer span { color: var(--ency-soft); font-size: .5rem; font-variant-numeric: tabular-nums; }
.rs-filter-shell > footer button { padding: .4rem .65rem; border: 1px solid var(--ency-line); border-radius: .45rem; background: #f7fbff; color: var(--ency-blue-deep); font-size: .54rem; }
.rs-filter-shell > footer button:hover { border-color: var(--ency-blue); background: var(--ency-blue-pale); }
[data-rs-filter-item][hidden] { display: none !important; }
.rs-live-notice { padding: .55rem 1rem; border-bottom: 1px solid rgba(70, 137, 111, .22); background: #edf8f3; color: #376b59; font-size: .58rem; font-weight: 700; }
.rs-selected-loadout { margin-bottom: .75rem; padding: .65rem; border: 1px solid var(--ency-line); border-radius: .75rem; background: #f5f9fd; }
.rs-selected-loadout > header { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; }
.rs-selected-loadout header small,
.rs-selected-loadout header strong { display: block; }
.rs-selected-loadout header small { color: var(--ency-soft); font-size: .46rem; }
.rs-selected-loadout header strong { margin-top: .1rem; font-size: .68rem; }
.rs-selected-loadout header > span { color: var(--ency-blue); font-size: .58rem; font-weight: 800; }
.rs-selected-loadout > div { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: .35rem; }
.rs-selected-slot { position: relative; min-width: 0; overflow: hidden; border: 1px dashed #b8c8da; border-radius: .55rem; background: rgba(255,255,255,.74); }
.rs-selected-slot.is-filled { border-style: solid; border-color: #87add2; background: #fff; }
.rs-selected-slot > button:first-child { display: grid; width: 100%; min-width: 0; justify-items: center; padding: .38rem .25rem .5rem; border: 0; background: transparent; }
.rs-selected-slot > button:first-child > span { display: grid; width: 2.8rem; height: 2.8rem; place-items: center; overflow: hidden; border-radius: .45rem; background: #e5eef8; }
.rs-selected-slot img { width: 100%; height: 100%; object-fit: contain; }
.rs-selected-slot i { font-style: normal; }
.rs-selected-slot small,
.rs-selected-slot strong,
.rs-selected-slot em { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rs-selected-slot small { margin-top: .22rem; color: var(--ency-soft); font-size: .43rem; }
.rs-selected-slot strong { margin-top: .08rem; font-size: .51rem; }
.rs-selected-slot em { margin-top: .08rem; color: var(--ency-blue); font-size: .42rem; font-style: normal; }
.rs-selected-slot-clear { position: absolute; top: .22rem; right: .22rem; display: grid; width: 1.2rem; height: 1.2rem; place-items: center; padding: 0; border: 1px solid var(--ency-line); border-radius: 50%; background: rgba(255,255,255,.9); color: var(--ency-muted); font-size: .65rem; }
.rs-selected-jade { display: grid; grid-template-columns: 4rem minmax(0,1fr); gap: .75rem; align-items: center; margin-bottom: .65rem; padding: .65rem; border: 1px dashed #b8c8da; border-radius: .65rem; background: #f5f9fd; }
.rs-selected-jade.is-filled { border-style: solid; border-color: #87add2; background: #fff; }
.rs-selected-jade > span { display: grid; width: 4rem; height: 4rem; place-items: center; overflow: hidden; border-radius: .52rem; background: #e4eef8; }
.rs-selected-jade img { width: 100%; height: 100%; object-fit: contain; }
.rs-selected-jade i { font-style: normal; }
.rs-selected-jade small { color: var(--ency-soft); font-size: .48rem; }
.rs-selected-jade strong { display: block; margin-top: .14rem; font-size: .7rem; }
.rs-selected-jade p { margin: .18rem 0 0; color: var(--ency-muted); font-size: .52rem; line-height: 1.5; }

/* Transparent white archive icons need a controlled dark plate to remain legible. */
.resonance-builder .ency-choice-card > span:first-child,
.resonance-builder .rs-selected-jade > span,
.resonance-builder .rs-inscription-slots button > span,
.resonance-builder .rs-equipped-item > span,
.resonance-builder .rs-selected-slot > button:first-child > span,
.resonance-builder .rs-equipment-flow-item,
.resonance-builder .rs-equipment-flow-options > button > span:first-child {
  border: 1px solid rgba(255, 255, 255, .26);
  background:
    radial-gradient(circle at 30% 22%, rgba(151, 200, 244, .7), transparent 43%),
    linear-gradient(145deg, #416f9d, #183a62);
  color: rgba(255, 255, 255, .86);
  box-shadow: inset 0 0 0 1px rgba(20, 45, 75, .16);
}
.resonance-builder .ency-choice-card.is-active > span:first-child,
.resonance-builder .rs-selected-jade.is-filled > span,
.resonance-builder .rs-inscription-slots button.is-filled > span,
.resonance-builder .rs-selected-slot.is-filled > button:first-child > span {
  background:
    radial-gradient(circle at 30% 22%, rgba(176, 220, 255, .82), transparent 42%),
    linear-gradient(145deg, #5286ba, #214a77);
}
.rs-inscription-slots { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: .3rem; margin: .55rem 0; }
.rs-inscription-slots button { position: relative; display: grid; min-width: 0; justify-items: center; padding: .35rem .18rem; border: 1px dashed #bac8d7; border-radius: .48rem; background: #f6f9fc; }
.rs-inscription-slots button.is-filled { border-style: solid; border-color: currentColor; background: #fff; }
.rs-inscription-slots button:disabled { opacity: .48; }
.rs-inscription-slots button > span { display: grid; width: 2.45rem; height: 2.45rem; place-items: center; overflow: hidden; border-radius: .4rem; color: var(--ency-soft); font-size: .55rem; }
.rs-inscription-slots img { width: 100%; height: 100%; object-fit: contain; }
.rs-inscription-slots small { max-width: 100%; margin-top: .15rem; overflow: hidden; font-size: .42rem; text-overflow: ellipsis; white-space: nowrap; }
.rs-inscription-slots em { position: absolute; top: .18rem; right: .18rem; padding: .08rem .18rem; border-radius: .22rem; background: rgba(27, 58, 94, .86); color: #fff; font-size: .36rem; font-style: normal; }
.rs-inscription-levels { display: grid; gap: .35rem; margin: .55rem 0 .7rem; }
.rs-inscription-level-row { display: grid; min-width: 0; grid-template-columns: 2.55rem minmax(0, 1fr) minmax(10rem, .75fr); gap: .55rem; align-items: center; padding: .45rem; border: 1px solid var(--ency-line); border-radius: .58rem; background: rgba(246, 250, 254, .82); }
.rs-inscription-level-row > span { display: grid; width: 2.55rem; height: 2.55rem; place-items: center; overflow: hidden; border-radius: .42rem; background: #e8f0f8; }
.rs-inscription-level-row > span img { width: 100%; height: 100%; object-fit: contain; }
.rs-inscription-level-row > div { min-width: 0; }
.rs-inscription-level-row strong { display: block; overflow: hidden; font-size: .63rem; text-overflow: ellipsis; white-space: nowrap; }
.rs-inscription-level-row small { display: block; margin-top: .1rem; color: var(--ency-muted); font-size: .48rem; }
.equipment-set-visual { padding: 1.15rem; overflow: hidden; border-radius: 1rem 1rem 0 0; background: radial-gradient(circle at 85% 10%, rgba(255,255,255,.84), transparent 32%), linear-gradient(145deg, #cfe5f8, #ecf4fb); }
.equipment-set-visual > small { color: var(--ency-blue); font-size: .55rem; letter-spacing: .12em; }
.equipment-set-visual > strong { display: block; margin: .18rem 0 1rem; font-size: clamp(1.5rem, 3vw, 2.6rem); letter-spacing: -.06em; }
.equipment-set-visual > div { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .55rem; }
.equipment-set-visual article { min-width: 0; padding: .55rem; border: 1px solid rgba(255,255,255,.78); border-radius: .7rem; background: rgba(255,255,255,.48); }
.equipment-set-visual article > span { display: grid; aspect-ratio: 1; place-items: center; overflow: hidden; }
.equipment-set-visual article img { width: 100%; height: 100%; object-fit: contain; }
.equipment-set-visual article small,
.equipment-set-visual article b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.equipment-set-visual article small { color: var(--ency-soft); font-size: .48rem; }
.equipment-set-visual article b { margin-top: .15rem; font-size: .58rem; }

@media (max-width: 40rem) {
  .rs-reference-appbar { grid-template-columns: 1fr; gap: .55rem; padding: .65rem; }
  .rs-reference-plan { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; }
  .rs-reference-plan > span { min-width: 0; }
  .rs-reference-plan strong { max-width: 10rem; }
  .rs-hero-picker { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .rs-hero-pick > span { width: 2.35rem; height: 2.35rem; }
  .rs-reference-hero-stage { min-height: 19rem; grid-template-columns: 1fr; }
  .rs-reference-hero-stage .rs-selected-hero-art { min-height: 12.5rem; }
  .rs-reference-hero-stage .rs-selected-hero-art img { height: 12.5rem; }
  .rs-reference-hero-copy { padding: 1rem 1.1rem 1.3rem; text-align: center; }
  .rs-reference-hero-copy h4 { font-size: 2.65rem; }
  .rs-reference-hero-copy p { margin-top: .65rem; }
  .rs-reference-config { grid-template-columns: .72fr 1.28fr; }
  .rs-reference-config > article,
  .rs-reference-config > div { padding: .7rem; }
  .rs-reference-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rs-gear-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rs-gear-tabs button:last-child { grid-column: 1 / -1; }
  .rs-set-gallery { grid-template-columns: 1fr; }
  .rs-set-choice { grid-template-columns: 4rem minmax(0, 1fr); }
  .rs-set-choice > span:first-child { width: 4rem; height: 4rem; }
  .rs-mix-slot-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rs-equipment-flow-options { grid-template-columns: 1fr; }
  .rs-equipment-flow-row > header { grid-template-columns: 2.8rem minmax(0, 1fr) auto; gap: .48rem; }
  .rs-equipment-flow-item { width: 2.8rem; height: 2.8rem; }
  .rs-filter-toolbar { grid-template-columns: 1fr; }
  .rs-selected-loadout > div { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .rs-selected-slot > button:first-child > span { width: 2.35rem; height: 2.35rem; }
  .rs-selected-jade { grid-template-columns: 3.2rem minmax(0,1fr); }
  .rs-selected-jade > span { width: 3.2rem; height: 3.2rem; }
  .rs-inscription-slots { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .rs-inscription-level-row { grid-template-columns: 2.5rem minmax(0, 1fr); }
  .rs-inscription-level-row .rs-stepper-wrap { grid-column: 1 / -1; }
  .equipment-set-visual > div { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .equipment-set-visual article:nth-child(4),
  .equipment-set-visual article:nth-child(5) { grid-column: span 1; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* 2026-08-10：百科工作台导航改为桌面左侧栏、移动端折叠目录。 */
@media (min-width: 56.01rem) {
  body > main { display: grid; width: min(100% - 3rem, 92rem); margin: 0 auto; grid-template-columns: minmax(15rem, 19rem) minmax(0, 1fr); gap: 1.3rem; align-items: start; }
  body > main > .ency-hero { grid-column: 1 / -1; width: 100%; }
  body > main > .ency-command { position: sticky; top: 5.2rem; grid-column: 1; width: 100%; max-height: calc(100vh - 6.4rem); margin: 2rem 0 5rem; padding: 1rem; overflow: auto; border: 1px solid var(--ency-line); border-radius: 1.15rem; background: rgba(249,252,255,.92); box-shadow: 0 1rem 2.5rem rgba(47,78,118,.08); scrollbar-width: thin; }
  .ency-command .ency-section-heading { margin-bottom: 1rem; }
  .ency-command .ency-section-heading h2 { font-size: 1.28rem; line-height: 1.25; letter-spacing: -.025em; }
  .ency-command .ency-mode-categories { grid-template-columns: 1fr; }
  .ency-command .ency-mode-categories small { white-space: normal; }
  .ency-command .ency-mode-grid { grid-template-columns: 1fr; gap: .45rem; }
  .ency-command .ency-mode-card { min-height: 4.6rem; display: grid; grid-template-columns: 2.15rem minmax(0,1fr); align-items: center; justify-content: initial; gap: .7rem; padding: .7rem; text-align: left; }
  .ency-command .ency-mode-card > span:last-child { min-width: 0; }
  .ency-command .ency-mode-count { top: .55rem; right: .65rem; }
  body > main > .ency-workspace { grid-column: 2; width: 100%; min-width: 0; margin: 2rem 0 5rem; }
  body > main > .ency-integrity { grid-column: 1 / -1; }
}

@media (max-width: 56rem) {
  .ency-command { padding: .7rem; margin-top: 1rem; border: 1px solid var(--ency-line); border-radius: 1rem; background: rgba(249,252,255,.92); box-shadow: 0 .8rem 2rem rgba(47,78,118,.08); }
  .ency-command .ency-section-heading { margin: 0; flex-direction: row; align-items: center; gap: .7rem; }
  .ency-command .ency-section-heading > div { min-width: 0; }
  .ency-command .ency-section-heading p { margin-bottom: .25rem; }
  .ency-command .ency-section-heading h2 { font-size: 1.05rem; line-height: 1.25; }
  .ency-command-toggle { display: flex; min-height: 2.8rem; flex: 0 0 auto; align-items: center; justify-content: center; gap: .5rem; padding: 0 .8rem; border: 1px solid rgba(54,95,144,.22); border-radius: .72rem; background: #fff; color: var(--ency-blue-deep); font: 750 .7rem/1 system-ui,"Microsoft YaHei",sans-serif; }
  .ency-command-toggle b { font-size: 1rem; transition: transform .2s ease; }
  .ency-command.is-open .ency-command-toggle b { transform: rotate(180deg); }
  .ency-command-body { display: none; padding-top: .75rem; }
  .ency-command.is-open .ency-command-body { display: block; }
}

.ency-circle-bridge{grid-column:1/-1!important}.ency-circle-bridge>header{display:flex;justify-content:space-between;align-items:end;gap:20px}.ency-circle-bridge>header small{font:600 10px Georgia,serif;letter-spacing:.18em;color:var(--ency-accent)}.ency-circle-bridge>header h3{margin:.25rem 0}.ency-circle-bridge>header a{font-size:12px;color:var(--ency-accent)}.ency-circle-frame{display:block;width:100%;height:2180px;margin-top:1rem;border:1px solid var(--ency-line);background:#f7fbfa}@media(max-width:720px){.ency-circle-bridge>header{display:block}.ency-circle-bridge>header a{display:inline-block;margin-top:.5rem}.ency-circle-frame{height:2820px}}

/* equipment-role-tabs-v19 */
.ency-equipment-role-tabs,
.rs-filter-facet-buttons { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; width: 100%; margin: 12px 0 18px; }
.ency-equipment-role-tabs button,
.rs-filter-facet-buttons button { min-height: 42px; padding: 8px 12px; border: 1px solid rgba(31,103,99,.24); background: #f6fbfa; color: #42666c; font: inherit; font-weight: 700; cursor: pointer; }
.ency-equipment-role-tabs button.is-active,
.rs-filter-facet-buttons button.is-active { border-color: #176e69; background: #176e69; color: #fff; }
.rs-filter-toolbar .rs-filter-facet-buttons { grid-column: 1 / -1; margin: 0; }
@media (max-width: 560px) {
  .ency-equipment-role-tabs, .rs-filter-facet-buttons { gap: 6px; }
  .ency-equipment-role-tabs button, .rs-filter-facet-buttons button { min-width: 0; padding-inline: 6px; }
}