/* Ranking and profiles share the public South Era palette. */
.se-ranking {
  --rank-gold: #ddc18b;
  --rank-copy: #c7c8cf;
  --rank-muted: #b6b7c2;
  --rank-line: #cbb7862d;
  padding: 60px 0 76px;
  color: #f3eee5;
  font: 16px/1.6 Manrope, Arial, sans-serif;
}
.se-ranking *, .se-ranking *::before, .se-ranking *::after { box-sizing: border-box; }
.se-ranking [hidden] { display: none !important; }
.se-ranking button, .se-ranking input, .se-ranking select { font: inherit; }
.se-ranking button { cursor: pointer; }
.se-ranking button:focus-visible, .se-ranking input:focus-visible, .se-ranking select:focus-visible, .se-ranking [tabindex]:focus-visible { outline: 2px solid #f0d59f; outline-offset: 4px; }
.se-ranking-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 34px; align-items: center; padding-bottom: 30px; border-bottom: 1px solid var(--rank-line); }
.se-ranking-eyebrow { display: block; color: var(--rank-gold); font-size: 14px; font-weight: 650; letter-spacing: .1em; line-height: 1.6; }
.se-ranking h1 { margin: 10px 0 16px; color: #f4efe6; font: 500 clamp(36px, 4.3vw, 56px)/1.18 Cinzel, Georgia, serif; letter-spacing: -.03em; }
.se-ranking .se-ranking-heading p { max-width: 63ch; margin: 0; color: var(--rank-copy); font-size: 17px; line-height: 1.75; }
.se-ranking-summary { min-width: 185px; padding: 8px 0 8px 28px; border-left: 1px solid var(--rank-line); }
.se-ranking-summary strong { display: block; font: 500 44px/1.2 Cinzel, Georgia, serif; color: var(--rank-gold); }
.se-ranking-summary span { display: block; margin-top: 4px; font-size: 16px; }
.se-ranking-summary small { display: block; max-width: 24ch; margin-top: 10px; color: var(--rank-muted); font-size: 14px; }
.se-ranking-demo { display: flex; gap: 16px; align-items: center; margin: 24px 0 0; padding: 17px 21px; border: 1px solid #c3a87549; border-radius: 5px; background: #bd985a0c; }
.se-ranking-demo > span { color: var(--rank-gold); font-size: 30px; }
.se-ranking .se-ranking-demo p { margin: 0; color: var(--rank-copy); font-size: 16px; line-height: 1.65; }
.se-ranking-demo strong { display: block; margin-bottom: 3px; color: #e8cfa2; font-size: 16px; }
.se-ranking-leaders { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 28px 0 34px; }
.se-ranking-leader { position: relative; isolation: isolate; min-height: 228px; overflow: hidden; padding: 24px; border: 1px solid var(--rank-line); border-radius: 5px; background: radial-gradient(ellipse at 95% 95%, #b3934b22, transparent 70%), #1a1a21; color: #eee9df; text-align: left; transition: border-color .18s, background-color .18s; }
.se-ranking-leader:hover { border-color: #ddc18b80; background-color: #202027; }
.se-ranking-leader:first-child { border-color: #c3a36a70; }
.se-ranking-leader-number { position: absolute; top: 10px; right: 15px; z-index: -1; font: 500 75px/1 Cinzel, Georgia, serif; color: #b39b6c1b; }
.se-ranking-leader img { position: absolute; z-index: -1; width: 166px; height: 220px; object-fit: contain; object-position: bottom; right: -15px; bottom: -1px; opacity: .75; filter: drop-shadow(0 0 22px #0009); mask-image: linear-gradient(90deg, transparent, black 25%); }
.se-ranking-leader::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, #18181fe8 10%, #18181f6b 67%, transparent); }
.se-ranking-leader-copy { display: flex; flex-direction: column; align-items: flex-start; position: relative; max-width: 100%; }
.se-ranking-leader-copy > small { font-size: 14px; letter-spacing: .1em; color: var(--rank-gold); }
.se-ranking-leader-copy > strong { margin-top: 8px; max-width: 100%; overflow-wrap: anywhere; font: 500 27px/1.3 Cinzel, Georgia, serif; color: #f5e9d4; }
.se-ranking-leader-copy > span:not(.se-ranking-leader-score):not(.se-ranking-leader-link) { color: #c4c3c7; font-size: 16px; }
.se-ranking-leader-score { margin-top: 13px; font-size: 23px; font-weight: 600; color: #e7d4af; }
.se-ranking-leader-score small { font-size: 14px; color: #c6c3bd; font-weight: 400; }
.se-ranking-leader-link { display: flex; align-items: center; gap: 14px; margin-top: 16px; color: #e8cc98; font-size: 14px; }
.se-ranking-leader-link > span { font-size: 18px; }
.se-ranking-board { margin-top: 28px; min-width: 0; border: 1px solid var(--rank-line); border-radius: 5px; background: #17171dd9; overflow: hidden; }
.se-ranking-board-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; padding: 20px 24px; border-bottom: 1px solid var(--rank-line); }
.se-ranking-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.se-ranking-tabs button { min-height: 46px; padding: 10px 17px; border: 1px solid #a9947040; border-radius: 4px; background: #1e1e25; color: #d2ced0; font-size: 16px; font-weight: 600; }
.se-ranking-tabs button[aria-pressed="true"] { border-color: #cfb07890; background: #d8b77a19; color: #f0d7aa; }
.se-ranking-tabs button:hover { border-color: #c5a66e; }
.se-ranking .se-ranking-board-head > p { margin: 0; color: var(--rank-muted); font-size: 14px; line-height: 1.6; }
.se-ranking-board-head > p > span { margin-left: 8px; color: var(--rank-gold); }
.se-ranking-controls { display: flex; gap: 18px; align-items: end; flex-wrap: wrap; padding: 24px 24px 14px; }
.se-ranking-controls > div { flex: 1 1 180px; min-width: 0; }
.se-ranking-controls > .se-ranking-search { flex: 2 1 300px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, .85fr); gap: 0 8px; }
.se-ranking-controls label { display: block; margin-bottom: 7px; color: #d6c3a2; font-size: 14px; font-weight: 550; }
.se-ranking-search > label:first-child { grid-column: 1/-1; }
.se-ranking-controls input, .se-ranking-controls select { display: block; width: 100%; max-width: 100%; min-width: 0; min-height: 48px; padding: 10px 12px; border: 1px solid #a6a4b044; border-radius: 4px; background-color: #111117; color: #e1e0e4; font-size: 16px; line-height: 1.5; color-scheme: dark; }
.se-ranking-controls input::placeholder { color: #acacb9; opacity: 1; }
.se-ranking-controls select { padding-right: 25px; }
.se-ranking-reset, .se-ranking-empty button, .se-ranking-equipment-retry { min-height: 46px; padding: 10px 14px; border: 1px solid #a9947055; border-radius: 4px; background: #25232a; color: #e8d0a8; font-size: 16px; }
.se-ranking-reset:hover, .se-ranking-empty button:hover, .se-ranking-equipment-retry:hover { background: #332c24; }
.se-ranking-results { min-height: 40px; padding: 4px 24px 14px; color: var(--rank-muted); font-size: 14px; }
.se-ranking [data-character-board], .se-ranking [data-guild-board] { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-color: #ad9364 #17171d; }
.se-ranking [data-character-board]:focus-visible, .se-ranking [data-guild-board]:focus-visible { outline: 2px solid #ddc18b; outline-offset: -2px; }
.se-ranking-table { width: 100%; border-collapse: collapse; table-layout: auto; text-align: left; color: var(--rank-copy); }
.se-ranking-table th { padding: 16px 11px; background: #111116b8; color: #c1b18f; font-size: 14px; line-height: 1.5; font-weight: 600; border-block: 1px solid #8e8b9b20; }
.se-ranking-table th:first-child { width: 55px; text-align: center; }
.se-ranking-table td { padding: 12px 11px; font-size: 16px; line-height: 1.5; border-bottom: 1px solid #b8b0a814; white-space: nowrap; }
.se-ranking-table th:not(:first-child):not(:nth-child(2)), .se-ranking-table td:not(:first-child):not(:nth-child(2)) { text-align: center; }
.se-ranking-table tbody tr:hover { background: #dbc49507; }
.se-ranking-position { text-align: center; color: #c6b18e; font-variant-numeric: tabular-nums; }
.se-ranking-position span { display: inline-flex; width: 31px; min-height: 31px; align-items: center; justify-content: center; }
.se-ranking-table tr:is([data-rank-position="1"], [data-rank-position="2"], [data-rank-position="3"]) .se-ranking-position span { border: 1px solid #d0b77752; border-radius: 3px; color: #e7c991; background: #d8b77a0a; }
.se-ranking-name { min-width: 180px; }
.se-ranking-name button { display: flex; gap: 11px; align-items: center; width: 100%; min-height: 48px; padding: 0; border: 0; background: transparent; color: #e9d7b5; text-align: left; }
.se-ranking-name button:hover strong { text-decoration: underline; text-underline-offset: 4px; }
.se-ranking-name img, .se-ranking-profile-class-icon { display: block; flex: 0 0 44px; width: 44px; height: 44px; object-fit: cover; object-position: 50% 25%; background: #202029; border: 1px solid #b5a27a3d; border-radius: 4px; }
.se-ranking-table .se-ranking-name img { flex-basis: 40px; width: 40px; height: 40px; }
.se-ranking-name button > span:not(.se-ranking-profile-arrow) { min-width: 0; }
.se-ranking-name strong { display: block; font-size: 16px; font-weight: 650; }
.se-ranking-status { display: inline-flex; align-items: center; gap: 6px; color: #b4b4c0; font-size: 14px; font-weight: 400; }
.se-ranking-status::before { content: ''; display: inline-block; width: 6px; height: 6px; background: #90919e; border-radius: 50%; }
.se-ranking-status.is-online { color: #add8bd; }
.se-ranking-status.is-online::before { background: #81c49a; }
.se-ranking-name .se-ranking-status { display: flex; margin-top: 3px; }
.se-ranking-profile-arrow { margin-left: auto; color: #c9ad77; }
.se-ranking-resets { color: #e3c389; font-weight: 650; }
.se-ranking-clan { color: #c8bca5; }
.se-ranking-clan-button { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 0; border: 0; background: transparent; color: #dfc694; text-align: left; }
.se-ranking-clan-button:hover .se-ranking-clan, .se-ranking-clan-button:hover > span:last-child { color: #f1d8a6; text-decoration: underline; text-underline-offset: 4px; }
.se-ranking-clan-arrow { font-size: 14px; color: #bfa46f; }
.se-ranking-guild-name { color: #e5c78f; font-weight: 600; }
.se-ranking-clan-identity { display: inline-flex; align-items: center; gap: 10px; max-width: 100%; min-height: 40px; text-align: left; vertical-align: middle; }
.se-ranking-clan-identity > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.se-ranking-guild-mark, .se-ranking-guild-mark-placeholder { display: block; flex: 0 0 48px; width: 48px; height: 48px; box-sizing: content-box; padding: 3px; border: 1px solid #b5a27a40; border-radius: 4px; background: #111118; object-fit: contain; }
.se-ranking-guild-mark { image-rendering: pixelated; }
.se-ranking-table .se-ranking-guild-mark { flex-basis: 32px; width: 32px; height: 32px; }
.se-ranking-guild-mark-placeholder { display: inline-flex; align-items: center; justify-content: center; color: #8e877b; font-size: 22px; font-weight: 400; }
.se-ranking-empty { padding: 48px 24px; text-align: center; }
.se-ranking-empty > span { color: #c6a66e; font-size: 36px; }
.se-ranking-empty h2 { margin: 8px 0; font: 500 25px/1.4 Cinzel, Georgia, serif; color: #e3d5ba; }
.se-ranking .se-ranking-empty p { margin: 10px 0 20px; color: var(--rank-copy); font-size: 16px; }
.se-ranking-footnote { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 19px 24px; }
.se-ranking .se-ranking-footnote p { margin: 0; max-width: 78ch; color: var(--rank-muted); font-size: 14px; line-height: 1.7; }
.se-ranking-footnote > span { flex: 0 0 auto; color: #c7b28d; font-size: 14px; }
.se-ranking-visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

/* Native dialog supplies background inertness, focus and Escape support. */
body.se-rank-dialog-open { overflow: hidden; }
.se-ranking-dialog { position: fixed; inset: 0; width: min(880px, calc(100vw - 40px)); max-width: none; max-height: calc(100dvh - 40px); margin: auto; padding: 0; overflow: auto; border: 1px solid #c7ac725e; border-radius: 7px; background: #17171e; color: #eee9df; box-shadow: 0 24px 100px #000b; font: 16px/1.6 Manrope, Arial, sans-serif; }
.se-ranking-dialog::backdrop { background: #050509d9; backdrop-filter: blur(5px); }
.se-ranking-profile { position: relative; min-width: 0; }
.se-ranking-dialog-close { position: absolute; top: 18px; right: 20px; z-index: 3; display: flex; align-items: center; gap: 16px; min-height: 44px; padding: 6px 12px; border: 1px solid #c1ac794c; border-radius: 4px; background: #17171ee8; color: #e5d5b7; font-size: 16px; }
.se-ranking-dialog-close > span { font-size: 26px; line-height: 1; }
.se-ranking-dialog-close:hover { background: #2c2730; }
.se-ranking-dialog-back { position: absolute; top: 18px; left: 20px; z-index: 3; display: flex; align-items: center; gap: 8px; min-height: 44px; max-width: calc(100% - 160px); padding: 6px 12px; border: 1px solid #c1ac794c; border-radius: 4px; background: #17171ee8; color: #e5d5b7; font-size: 15px; }
.se-ranking-dialog-back:hover { background: #2c2730; }
.se-ranking-profile-hero { display: grid; grid-template-columns: 255px minmax(0, 1fr); min-height: 340px; padding: 70px 32px 22px 12px; gap: 20px; border-bottom: 1px solid #b59c5c38; background: radial-gradient(ellipse at 15% 90%, #b1a05a20, transparent 60%), #14141b; }
.se-ranking-profile-art { display: flex; align-items: end; justify-content: center; min-width: 0; margin-top: -46px; margin-bottom: -22px; overflow: hidden; }
.se-ranking-profile-art img { display: block; max-width: 100%; width: 255px; height: 310px; object-fit: contain; object-position: center bottom; filter: drop-shadow(0 0 20px #0005); }
.se-ranking-profile-identity { min-width: 0; }
.se-ranking-profile-nameplate { display: flex; align-items: center; gap: 12px; margin: 8px 0 3px; }
.se-ranking-profile-nameplate .se-ranking-profile-class-icon { flex-basis: 48px; width: 48px; height: 48px; }
.se-ranking-profile-identity h2 { margin: 8px 0 3px; overflow-wrap: anywhere; font: 500 38px/1.2 Cinzel, Georgia, serif; color: #f1e1c4; }
.se-ranking-profile-nameplate h2 { min-width: 0; margin: 0; }
.se-ranking .se-ranking-profile-identity > p { margin: 8px 0; color: #d0c9c2; font-size: 17px; }
.se-ranking-profile-progress { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px 14px; margin: 21px 0 0; }
.se-ranking-profile-progress > div:last-child { grid-column: 1/-1; }
.se-ranking-profile-progress dt { color: #bcb6ac; font-size: 14px; }
.se-ranking-profile-progress dd { margin: 2px 0 0; overflow-wrap: anywhere; color: #e5c78f; font-size: 21px; font-weight: 600; }
.se-ranking-profile-progress > div:last-child dd { font-size: 17px; }
.se-ranking-profile-content { padding: 26px 32px 24px; }
.se-ranking-profile-content section + section { margin-top: 27px; }
.se-ranking-profile-content h3 { margin: 0 0 14px; font: 500 23px/1.4 Cinzel, Georgia, serif; color: #e5d4b4; }
.se-ranking-profile-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.se-ranking-profile-stats > div { min-width: 0; padding: 14px; border: 1px solid #bfb4a226; border-radius: 4px; background: #1d1d25; }
.se-ranking-profile-stats span { display: block; color: #bcb9b5; font-size: 14px; }
.se-ranking-profile-stats strong { display: block; margin-top: 3px; font-size: 22px; line-height: 1.4; font-weight: 600; color: #e6d6b7; overflow-wrap: anywhere; }
.se-ranking .se-ranking-profile-note, .se-ranking .se-rank-equipment-note { margin: 0; padding: 18px; border: 1px dashed #b7ad9935; border-radius: 4px; background: #111117; color: #c0bdc4; font-size: 16px; line-height: 1.7; }
.se-ranking-profile-choices { display: flex; flex-wrap: wrap; gap: 14px; margin: 0; }
.se-ranking-profile-choices > div { flex: 1 1 190px; padding: 14px 18px; border-left: 2px solid #c4a870; background: #c7ae6b09; }
.se-ranking-profile-choices dt { color: #bfb9ad; font-size: 14px; }
.se-ranking-profile-choices dd { margin: 4px 0 0; color: #ead8b6; font-size: 17px; overflow-wrap: anywhere; }
.se-ranking-profile-equipment { display: flex; justify-content: center; max-width: 100%; min-width: 0; }
.se-ranking-profile-equipment > p { width: 100%; }
.se-ranking-equipment-retry { margin-top: 12px; }
.se-ranking .se-ranking-profile-disclaimer { margin: 23px 0 0; padding-top: 17px; border-top: 1px solid #bbb0a522; font-size: 14px; line-height: 1.7; color: #b8b5bd; }

/* Clan profiles keep names and emblems together, with readable horizontal member rows. */
.se-ranking-guild-profile { position: relative; min-width: 0; }
.se-ranking-guild-hero { display: flex; align-items: center; gap: 25px; min-height: 235px; padding: 84px 32px 30px; border-bottom: 1px solid #b59c5c38; background: radial-gradient(ellipse at 15% 80%, #ae8c3c27, transparent 65%), #14141b; }
.se-ranking-guild-crest { flex: 0 0 auto; padding: 10px; border: 1px solid #bda56b42; border-radius: 6px; background: #b49c590c; }
.se-ranking-guild-crest .se-ranking-guild-mark { flex-basis: 96px; width: 96px; height: 96px; padding: 5px; border-color: #c0aa6c4d; border-radius: 3px; }
.se-ranking-guild-crest .se-ranking-guild-mark-placeholder { font-size: 48px; }
.se-ranking-guild-identity { min-width: 0; }
.se-ranking-guild-identity h2 { margin: 8px 0; overflow-wrap: anywhere; color: #f1e1c4; font: 500 42px/1.2 Cinzel, Georgia, serif; }
.se-ranking .se-ranking-guild-identity p { margin: 10px 0 0; color: #c7c1b8; font-size: 16px; line-height: 1.7; }
.se-ranking-guild-content { padding: 28px 32px; }
.se-ranking-guild-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 30px; border: 1px solid #bfb4a226; border-radius: 4px; background: #1c1c24; }
.se-ranking-guild-facts > div { min-width: 0; padding: 17px 20px; }
.se-ranking-guild-facts > div + div { border-left: 1px solid #bfb4a226; }
.se-ranking-guild-facts dt { color: #bcb6ac; font-size: 14px; }
.se-ranking-guild-facts dd { margin: 3px 0 0; color: #e8cc96; font-size: 23px; font-weight: 600; overflow-wrap: anywhere; }
.se-ranking-guild-members-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.se-ranking-guild-members-heading h3 { margin: 0; color: #e5d4b4; font: 500 25px/1.4 Cinzel, Georgia, serif; }
.se-ranking-guild-members-heading > span { color: #c8b58e; font-size: 14px; }
.se-ranking .se-ranking-guild-roster-note { max-width: 76ch; margin: 9px 0 18px; color: #c1bdc4; font-size: 15px; line-height: 1.7; }
.se-ranking-guild-members { list-style: none; margin: 0; padding: 0; overflow: hidden; border: 1px solid #bfb4a226; border-radius: 4px; }
.se-ranking-guild-members:empty { display: none; }
.se-ranking-guild-members li + li { border-top: 1px solid #bfb4a21c; }
.se-ranking-guild-member { display: flex; width: 100%; gap: 13px; align-items: center; min-height: 77px; padding: 14px 17px; border: 0; background: #1c1c23; color: #e2d3b7; text-align: left; }
button.se-ranking-guild-member:hover { background: #26242a; }
.se-ranking-guild-member > img { flex: 0 0 40px; width: 40px; height: 40px; object-fit: cover; object-position: 50% 25%; border: 1px solid #b5a27a3d; border-radius: 4px; background: #202029; }
.se-ranking-guild-member-identity { min-width: 0; }
.se-ranking-guild-member-identity strong { display: block; color: #e8d4ac; font-size: 17px; font-weight: 600; overflow-wrap: anywhere; }
.se-ranking-guild-member-identity small { display: block; margin-top: 2px; color: #bcb9bd; font-size: 14px; }
.se-ranking-guild-leader-label { padding: 2px 8px; border: 1px solid #c4a4674f; border-radius: 3px; color: #dcc18a; font-size: 13px; }
.se-ranking-guild-member-action { flex: 0 0 auto; margin-left: auto; color: #c7b18a; font-size: 14px; }
.se-ranking-guild-profile .se-ranking-profile-note { margin-top: 12px; }

/* Existing public equipment output; use percentages so the stage fits mobiles. */
.se-ranking .rank-equip-stage { position: relative; flex: 0 1 316px; width: 316px; max-width: 100%; aspect-ratio: 1; border-radius: 5px; background-size: contain; background-position: center; background-repeat: no-repeat; }
.se-ranking .rank-equip-slot { position: absolute; width: 20.89%; height: 20.89%; background-size: contain; background-position: center; background-repeat: no-repeat; }
.se-ranking .rank-equip-slot.ring-slot, .se-ranking .rank-equip-slot.pendant-slot { width: 9.18%; height: 9.18%; background-size: 70%; }
.se-ranking .rank-equip-slot.pet-slot { left: 7.28%; top: 11.39%; }
.se-ranking .rank-equip-slot.helm-slot { left: 39.56%; top: 11.39%; }
.se-ranking .rank-equip-slot.wings-slot { right: 7.28%; top: 11.39%; }
.se-ranking .rank-equip-slot.left-hand-slot { left: 7.28%; top: 34.49%; }
.se-ranking .rank-equip-slot.chest-slot { left: 39.56%; top: 34.49%; }
.se-ranking .rank-equip-slot.right-hand-slot { right: 7.28%; top: 34.49%; }
.se-ranking .rank-equip-slot.gloves-slot { left: 7.28%; bottom: 11.39%; }
.se-ranking .rank-equip-slot.pants-slot { left: 39.56%; bottom: 11.39%; }
.se-ranking .rank-equip-slot.boots-slot { right: 7.28%; bottom: 11.39%; }
.se-ranking .rank-equip-slot.pendant-slot { left: 28.48%; top: 36.39%; }
.se-ranking .rank-equip-slot.ring-left { left: 28.48%; top: 65.51%; }
.se-ranking .rank-equip-slot.ring-right { right: 32.28%; top: 65.51%; }
.se-ranking .rank-equip-slot.has-item { cursor: help; }
.se-ranking .rank-equip-tip { display: none; position: absolute; z-index: 10; width: min(250px, calc(100vw - 90px)); padding: 14px; left: 50%; top: 100%; transform: translate(-50%, 6px); border: 1px solid #d1b58170; border-radius: 5px; background: #101016; box-shadow: 0 10px 25px #0009; text-align: left; pointer-events: none; }
.se-ranking .rank-equip-slot:hover .rank-equip-tip, .se-ranking .rank-equip-slot:focus .rank-equip-tip { display: block; }
.se-ranking .rank-equip-tip-title { color: #ead4a9; font-size: 16px; font-weight: 600; margin-bottom: 7px; }
.se-ranking .rank-equip-tip-line { color: #c5c2c7; font-size: 14px; line-height: 1.7; }
.se-ranking .rank-equip-slot:is(.pet-slot, .left-hand-slot, .gloves-slot, .pendant-slot, .ring-left) .rank-equip-tip { left: 0; transform: translateY(6px); }
.se-ranking .rank-equip-slot:is(.wings-slot, .right-hand-slot, .boots-slot, .ring-right) .rank-equip-tip { right: 0; left: auto; transform: translateY(6px); }

@media (max-width: 1100px) {
  .se-ranking-controls { gap: 14px; }
  .se-ranking-controls > .se-ranking-search { flex-basis: 100%; }
  .se-ranking-table th, .se-ranking-table td { padding-inline: 8px; }
  .se-ranking-table .se-ranking-name { min-width: 180px; }
  .se-ranking-leader { padding: 20px; }
  .se-ranking-leader img { width: 145px; right: -24px; }
}
@media (max-width: 1100px) {
  .se-ranking { padding-top: 35px; }
  .se-ranking-heading { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .se-ranking-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 7px 13px; padding: 0; border: 0; }
  .se-ranking-summary strong { font-size: 30px; }
  .se-ranking-summary span { margin: 0; }
  .se-ranking-summary small { margin: 0 0 0 auto; max-width: 100%; }
  .se-ranking-leaders { gap: 10px; }
  .se-ranking-leader { min-height: 224px; padding: 18px 15px; }
  .se-ranking-leader-copy > strong { font-size: 23px; }
  .se-ranking-leader img { width: 130px; opacity: .45; right: -40px; }
  .se-ranking-leader-copy > span:not(.se-ranking-leader-score):not(.se-ranking-leader-link) { min-height: 48px; }
  .se-ranking-board-head, .se-ranking-controls { padding-inline: 18px; }
  .se-ranking-results { padding-inline: 18px; }
  .se-ranking-footnote { align-items: start; flex-direction: column; padding-inline: 18px; gap: 10px; }
  .se-ranking-profile-hero { grid-template-columns: 185px minmax(0, 1fr); gap: 16px; padding-inline: 12px 24px; }
  .se-ranking-profile-art img { height: 295px; }
  .se-ranking-profile-identity h2 { font-size: 33px; }
  .se-ranking-profile-progress { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .se-ranking-profile-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .se-ranking h1 { font-size: 35px; }
  .se-ranking-summary small { flex-basis: 100%; margin: 0; }
  .se-ranking-demo { padding: 15px; gap: 11px; align-items: start; }
  .se-ranking-leaders { grid-template-columns: minmax(0, 1fr); gap: 12px; margin-block: 24px; }
  .se-ranking-leader { min-height: 170px; padding: 20px; }
  .se-ranking-leader img { width: 160px; height: 185px; right: 10px; opacity: .85; }
  .se-ranking-leader-number { right: 32px; }
  .se-ranking-leader-copy > strong { font-size: 26px; }
  .se-ranking-leader-copy > span:not(.se-ranking-leader-score):not(.se-ranking-leader-link) { min-height: 0; }
  .se-ranking-leader-score { margin-top: 5px; }
  .se-ranking-leader-link { margin-top: 8px; }
  .se-ranking-controls > .se-ranking-search { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .se-ranking-controls > div { flex-basis: 100%; }
  .se-ranking-controls select, .se-ranking-controls input { min-height: 48px; }
  .se-ranking-reset { width: 100%; }
  .se-ranking-name img { display: block; }
  .se-ranking-name button { width: 100%; }
  .se-ranking-profile-arrow { margin-left: auto; }
  .se-ranking-dialog { width: calc(100vw - 24px); max-height: calc(100dvh - 24px); border-radius: 5px; }
  .se-ranking-dialog-close { right: 13px; top: 12px; }
  .se-ranking-dialog-back { left: 13px; top: 12px; max-width: calc(100% - 140px); padding-inline: 8px; font-size: 14px; }
  .se-ranking-profile-hero { display: block; padding: 70px 22px 24px; position: relative; isolation: isolate; overflow: hidden; }
  .se-ranking-profile-art { position: absolute; right: -30px; top: 62px; bottom: 0; width: 170px; margin: 0; z-index: -1; opacity: .2; mask-image: linear-gradient(90deg, transparent, black 30%); }
  .se-ranking-profile-art img { width: 170px; height: 300px; }
  .se-ranking-profile-identity h2 { font-size: 34px; }
  .se-ranking-profile-progress { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .se-ranking-profile-content { padding: 23px 20px; }
  .se-ranking-profile-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .se-ranking-profile-stats > div { padding: 12px; }
  .se-ranking-profile-stats strong { font-size: 21px; }
  .se-ranking-guild-hero { align-items: flex-start; gap: 16px; padding: 78px 20px 24px; }
  .se-ranking-guild-crest { padding: 5px; }
  .se-ranking-guild-crest .se-ranking-guild-mark { width: 64px; height: 64px; flex-basis: 64px; padding: 3px; }
  .se-ranking-guild-identity h2 { font-size: 30px; }
  .se-ranking-guild-identity .se-ranking-eyebrow { font-size: 12px; }
  .se-ranking-guild-content { padding: 23px 20px; }
  .se-ranking-guild-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .se-ranking-guild-facts > div { padding: 14px; }
  .se-ranking-guild-facts > div:first-child { grid-column: 1/-1; border-bottom: 1px solid #bfb4a226; }
  .se-ranking-guild-facts > div:nth-child(2) { border-left: 0; }
  .se-ranking-guild-facts dd { font-size: 21px; }
  .se-ranking-guild-member { gap: 10px; padding: 13px 12px; flex-wrap: wrap; }
  .se-ranking-guild-member-action { font-size: 13px; }
  .se-ranking-guild-member-identity { flex: 1; }
  .se-ranking-guild-leader-label { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .se-ranking * { transition: none !important; } }