/* Rankings tables. Loaded only on /rankings pages (see RK_STYLES in src/routes/rankings.tsx).
   Desktop (720px and up): one compact table with a sticky header, fixed column widths, and a whole-row link.
   Phones (under 720px): the same schools as a card list, with no horizontal scrolling. */

:root {
  --rk-gold: #b08a2e;
  --rk-silver: #7c8799;
  --rk-bronze: #a46a3f;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --rk-gold: #d8b46a; --rk-silver: #c3ccd9; --rk-bronze: #d59a70; }
}
:root[data-theme="dark"] { --rk-gold: #d8b46a; --rk-silver: #c3ccd9; --rk-bronze: #d59a70; }

/* ---------- Desktop table ---------- */

.rk-wrap { border: 1px solid var(--line); border-radius: var(--r); background: var(--bg); box-shadow: var(--shadow-sm); overflow-x: auto; }
/* From 1000px the table always fits, so the wrapper clips instead of scrolling and the header can stick. */
@media (min-width: 62.5rem) { .rk-wrap { overflow: clip; } }

.rk-table { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: .92rem; color: var(--text); font-variant-numeric: tabular-nums; }
.rk-cap { caption-side: top; text-align: left; padding: .85rem 1.1rem .65rem; font-size: .82rem; font-weight: 600; color: var(--muted); }

.rk-table th, .rk-table td { padding: .5rem .55rem; text-align: left; vertical-align: middle; }
.rk-table th:first-child, .rk-table td:first-child { padding-left: 1.1rem; }
.rk-table th:last-child, .rk-table td:last-child { padding-right: 1.1rem; }
.rk-c { text-align: center !important; }
.rk-r { text-align: right !important; }

/* Column widths: fixed, so every grade and pillar column lines up. The school column takes the rest. */
.rk-w-rank { width: 4.4rem; }
.rk-w-ring { width: 6.25rem; }
.rk-w-g { width: 7.4rem; }
.rk-w-p { width: 6.9rem; }
.rk-w-n { width: 6.4rem; }

.rk-table thead th {
  position: sticky; top: 4.1rem; z-index: 3;
  background: var(--surface); border-bottom: 1px solid var(--line-strong);
  padding-top: .62rem; padding-bottom: .62rem;
  font-size: .8rem; font-weight: 700; line-height: 1.25; color: var(--subtle); white-space: normal; text-wrap: balance;
}
.rk-th { display: inline-flex; align-items: center; gap: .2rem; }
.rk-table thead .rk-c .rk-th { justify-content: center; }
.rk-table thead .rk-r .rk-th { justify-content: flex-end; }

.rk-table tbody tr { position: relative; }
.rk-table tbody th, .rk-table tbody td { height: 4rem; padding-top: .35rem; padding-bottom: .35rem; border-bottom: 1px solid var(--line); background: var(--bg); font-weight: 400; }
.rk-table tbody tr:last-child > * { border-bottom: 0; }
.rk-table tbody tr:nth-child(even) > * { background: var(--surface); }
.rk-table tbody tr:hover > *, .rk-table tbody tr:focus-within > * { background: var(--surface-2); }
.rk-table tbody tr:hover .rk-name, .rk-table tbody tr:focus-within .rk-name { color: var(--blue); text-decoration: underline !important; text-decoration-color: currentColor; }

/* Whole row is the link: the name's ::after covers the row. Badges and grades sit above it. */
.rk-name::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
/* Keyboard focus on the name: the whole row is outlined, so the target is clear. */
.rk-table tbody tr:has(.rk-name:focus-visible) > * { box-shadow: inset 0 2px 0 var(--focus), inset 0 -2px 0 var(--focus); }
.rk-name:focus-visible { outline: none; }
.rk-table .pop-host { position: relative; z-index: 2; }
.rk-table .pop-trigger, .rk-table .pop-i { position: relative; z-index: 2; }

/* Rank */
.rk-rank .rk-num { font-size: 1rem; font-weight: 800; color: var(--ink); letter-spacing: -.01em; }
.rk-num { display: inline-block; min-width: 2ch; }
.rk-top-1 .rk-num { color: var(--rk-gold); }
.rk-top-2 .rk-num { color: var(--rk-silver); }
.rk-top-3 .rk-num { color: var(--rk-bronze); }
.rk-row.rk-top-1 > :first-child { box-shadow: inset 3px 0 0 var(--rk-gold); }
.rk-row.rk-top-2 > :first-child { box-shadow: inset 3px 0 0 var(--rk-silver); }
.rk-row.rk-top-3 > :first-child { box-shadow: inset 3px 0 0 var(--rk-bronze); }

/* School cell: name on one line, city and state beneath. */
.rk-table .rk-school { width: auto; min-width: 0; }
.rk-school-h { text-align: left; }
.rk-name-row { display: flex; align-items: center; gap: .4rem; min-width: 0; }
.rk-tags { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .3rem; }
.rk-tags:empty { display: none; }
.rk-name {
  display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-weight: 700; color: var(--ink) !important; text-decoration: none !important; font-size: .95rem; line-height: 1.3;
}
.rk-meta { display: block; margin-top: .05rem; font-size: .8rem; line-height: 1.3; color: var(--muted); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 62.49rem) {
  .rk-name { white-space: normal; }
}

/* Icon-only badges: Honor Roll (star), Recommended (seal), Catholic (cross). */
.rk-badge { display: inline-flex; align-items: center; gap: .25rem; height: 1.35rem; padding: 0 .5rem 0 .4rem; border-radius: 999px; border: 1px solid transparent; flex: none; cursor: help; font-size: .7rem; font-weight: 700; line-height: 1; white-space: nowrap; letter-spacing: .01em; }
.rk-badge svg { width: .72rem; height: .72rem; flex: none; }
.rk-badge.honor { color: var(--gold-fill-ink); background: var(--gold-fill); border-color: var(--gold-fill); }
.rk-badge.honor.life { color: var(--teal-ink); background: var(--teal-50); border-color: var(--teal-100); }
.rk-badge.rec { color: var(--blue); background: var(--blue-50); border-color: var(--blue-100); }
.rk-badge.cath { color: var(--navy, #14325c); background: var(--surface-2); border-color: var(--line-strong); }
.rk-badge:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }

/* Score ring: the shared small ring, scaled to a 3rem disc so the row stays 56-64px. */
.rk-ring { display: inline-flex; }
.rk-table .ring, .rk-list .ring { width: 3rem !important; height: 3rem !important; }
.rk-table .ring svg, .rk-list .ring svg { width: 100%; height: 100%; }
/* The life ring's cross keeps its weight when the ring is scaled down (user units: the ring is drawn at 96). */
.rk-table .ring-cross, .rk-list .ring-cross { stroke-width: 3.6px; }
/* At 3rem a three-digit score (100) must fit inside the disc, so the number is set smaller here. */
.rk-table .ring.sm .ring-label b, .rk-list .ring.sm .ring-label b { font-size: .68rem; letter-spacing: -.04em; white-space: nowrap; }

/* Grades: badge and score on one line ("A 93"), centered in the column. */
.rk-gs { display: inline-flex; align-items: center; justify-content: center; gap: .35rem; white-space: nowrap; }
.rk-gs .grade.sm { width: 1.6rem; height: 1.6rem; font-size: .85rem; border-radius: 7px; }
.rk-n { min-width: 1.9ch; font-size: .84rem; font-weight: 700; color: var(--muted); font-variant-numeric: tabular-nums; text-align: left; }

/* Not enough information: a muted dash with its own popover. */
.rk-dash { display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 7px; color: var(--subtle); font-weight: 700; font-size: 1rem; cursor: help; }
.rk-dash:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }

/* Column (i) buttons are a touch smaller in headers. */
.rk-th .pop-i { width: 1.25rem; height: 1.25rem; }
.rk-th .pop-i svg { width: .8rem; height: .8rem; }

/* Mid-width (720 to 999px): pillar score numbers step down so the columns still fit. */
@media (max-width: 62.49rem) {
  .rk-w-g { width: 6.6rem; }
  .rk-w-p { width: 5.2rem; }
  .rk-w-n { width: 5.6rem; }
  .rk-w-ring { width: 5.2rem; }
  .rk-w-p .rk-n { display: none; }
  .rk-w-p .rk-th .pop-i { display: none; }
}
@media (max-width: 62.49rem) and (min-width: 45rem) {
  .rk-w-p .rk-th { white-space: normal; }
}

/* ---------- Phone card list ---------- */

.rk-phone-cap, .rk-list { display: none; }
.rk-phone-cap { margin: 0 0 .75rem; font-size: .84rem; font-weight: 600; color: var(--muted); }

@media (max-width: 44.99rem) {
  .rk-wrap { display: none; }
  .rk-phone-cap { display: block; }
  .rk-list { display: grid; gap: .7rem; list-style: none; margin: 0; padding: 0; }

  .rk-card {
    position: relative; background: var(--bg); border: 1px solid var(--line); border-radius: var(--r);
    box-shadow: var(--shadow-sm); padding: .85rem .9rem;
    transition: transform .2s, box-shadow .2s, border-color .2s;
  }
  .rk-card:hover, .rk-card:focus-within { transform: translateY(-2px); box-shadow: var(--shadow); border-color: var(--line-strong); }
  .rk-card.rk-top-1 { box-shadow: inset 3px 0 0 var(--rk-gold), var(--shadow-sm); }
  .rk-card.rk-top-2 { box-shadow: inset 3px 0 0 var(--rk-silver), var(--shadow-sm); }
  .rk-card.rk-top-3 { box-shadow: inset 3px 0 0 var(--rk-bronze), var(--shadow-sm); }
  .rk-card.rk-top-1:hover, .rk-card.rk-top-1:focus-within { box-shadow: inset 3px 0 0 var(--rk-gold), var(--shadow); }
  .rk-card.rk-top-2:hover, .rk-card.rk-top-2:focus-within { box-shadow: inset 3px 0 0 var(--rk-silver), var(--shadow); }
  .rk-card.rk-top-3:hover, .rk-card.rk-top-3:focus-within { box-shadow: inset 3px 0 0 var(--rk-bronze), var(--shadow); }
  .rk-card-head { display: grid; grid-template-columns: 2rem 3rem minmax(0, 1fr); gap: .7rem; align-items: center; }
  .rk-card-head.rk-noring { grid-template-columns: 2rem minmax(0, 1fr); }
  .rk-card-rank { text-align: center; }
  .rk-card-rank .rk-num { font-size: 1.15rem; font-weight: 800; color: var(--ink); }
  .rk-card-id { min-width: 0; }
  .rk-card .rk-name { white-space: normal; font-size: 1rem; }
  /* Phone cards: name, then city, then the badges on their own line, so every row looks the same (Todd, October 19, 2026). */
  .rk-card .rk-card-id { display: grid; gap: .1rem; }
  .rk-card .rk-name-row { display: contents; }
  .rk-card .rk-name { order: 1; }
  .rk-card .rk-meta { order: 2; }
  .rk-card .rk-tags { order: 3; margin-top: .3rem; }
  .rk-card .rk-meta { white-space: normal; }
  .rk-card .rk-name::after { content: ""; position: absolute; inset: 0; border-radius: var(--r); }
  .rk-card .pop-host { position: relative; z-index: 2; }
  .rk-card-meta { margin: .6rem 0 0; font-size: .84rem; color: var(--muted); }

  .rk-chips { list-style: none; margin: .8rem 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .45rem .75rem; }
  .rk-chip { display: flex; align-items: center; justify-content: space-between; gap: .4rem; min-width: 0; padding-top: .45rem; border-top: 1px solid var(--line); font-size: .84rem; font-weight: 600; color: var(--text); }
  .rk-chip .rk-cl { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); }
  .rk-chip .rk-gs { justify-content: flex-end; flex: none; }
  .rk-chip .rk-gs .grade.sm { width: 1.5rem; height: 1.5rem; font-size: .8rem; }
  .rk-chip .rk-n { font-size: .8rem; }
}

@media (prefers-reduced-motion: reduce) {
  .rk-card { transition: none; }
  .rk-card:hover, .rk-card:focus-within { transform: none; }
}
@media (forced-colors: active) {
  .rk-badge, .rk-dash { forced-color-adjust: none; }
  .rk-row.rk-top-1 > :first-child, .rk-row.rk-top-2 > :first-child, .rk-row.rk-top-3 > :first-child { box-shadow: none; }
}

/* ---------- Hub: tabs and ranking cards (/rankings) ---------- */

.rk-tabs {
  display: flex; gap: .3rem; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  margin: 1.4rem 0 1.6rem; padding: .3rem; border: 1px solid var(--line); border-radius: 999px; background: var(--surface);
  width: fit-content; max-width: 100%;
}
.rk-tabs::-webkit-scrollbar { display: none; }
.rk-tabs a {
  flex: none; display: inline-flex; align-items: center; gap: .5rem; padding: .5rem .95rem; border-radius: 999px;
  font-size: .92rem; font-weight: 700; color: var(--muted); white-space: nowrap; text-decoration: none !important;
}
.rk-tabs a:hover { color: var(--ink); background: var(--surface-2); }
.rk-tabs a[aria-selected="true"] { color: var(--btn-ink); background: var(--btn-bg); }
.rk-tabs a[aria-selected="true"] .rk-count { background: rgba(255, 255, 255, .22); color: var(--btn-ink); }
.rk-tabs a:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
/* Phones (Oct 20, 2026): the tabs share the row, so "By state" is never cut off. A tab's count drops under its name
   when the words do not fit; nothing scrolls sideways. */
@media (max-width: 47.99rem) {
  .rk-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; overflow: visible; border-radius: 1.1rem; }
  .rk-tabs a { display: block; white-space: normal; min-width: 0; padding: .5rem .3rem; font-size: .88rem; line-height: 1.25; text-align: center; }
  .rk-tabs .rk-count { display: inline-block; vertical-align: middle; margin-left: .3rem; }
}
.rk-count {
  min-width: 1.6rem; height: 1.35rem; padding: 0 .4rem; border-radius: 999px; background: var(--line);
  color: var(--subtle); font-size: .74rem; font-weight: 800; line-height: 1.35rem; text-align: center; font-variant-numeric: tabular-nums;
}
.rk-panel { margin-bottom: 2.75rem; }
.rk-panel[hidden] { display: none; }
.rk-note { max-width: 48rem; color: var(--muted); font-size: .95rem; margin: 0 0 1.25rem; }

.rk-grid { display: grid; gap: 1rem; align-items: stretch; grid-template-columns: 1fr; }
@media (min-width: 40rem) { .rk-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 58rem) { .rk-grid { grid-template-columns: repeat(3, 1fr); } }

.rk-hub {
  position: relative; display: flex; flex-direction: column; gap: .45rem; height: 100%; margin: 0;
  padding: 1.15rem 1.25rem 1rem; transition: transform .2s, box-shadow .2s, border-color .2s;
}
.rk-hub:hover, .rk-hub:focus-within { transform: translateY(-2px); box-shadow: var(--shadow); border-color: var(--line-strong); }
.rk-hub-ico {
  width: 2.2rem; height: 2.2rem; border-radius: 10px; display: inline-grid; place-items: center;
  background: var(--blue-50); color: var(--blue); margin-bottom: .2rem;
}
.rk-hub-title { margin: 0; font-size: 1.04rem; line-height: 1.3; }
.rk-hub-title a { color: var(--ink) !important; text-decoration: none !important; }
.rk-hub-title a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.rk-hub:hover .rk-hub-title a, .rk-hub:focus-within .rk-hub-title a { color: var(--blue) !important; text-decoration: underline !important; text-underline-offset: .18em; }
.rk-hub-blurb { margin: 0; flex: 1 1 auto; font-size: .9rem; line-height: 1.5; color: var(--muted); }
.rk-hub-meta {
  margin: .3rem 0 0; padding-top: .6rem; border-top: 1px solid var(--line);
  display: flex; align-items: center; justify-content: space-between; font-size: .8rem; font-weight: 700; color: var(--subtle);
}
.rk-hub-meta::after { content: "›"; font-size: 1.15rem; line-height: 1; color: var(--blue); transition: transform .2s; }
.rk-hub:hover .rk-hub-meta::after { transform: translateX(3px); }
@media (prefers-reduced-motion: reduce) { .rk-hub, .rk-hub-meta::after { transition: none; } .rk-hub:hover { transform: none; } }

.rk-group { margin: 1.6rem 0 .4rem; font-size: 1rem; }
.rk-lists { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.rk-lists li {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .2rem 1rem;
  padding: .6rem 0; border-bottom: 1px solid var(--line);
}
.rk-lists a { font-weight: 700; }

/* Which-colleges switch on the Catholic life rankings: full labels on wide screens, short ones on phones. */
.seg-switch a { white-space: nowrap; }
.seg-switch .seg-short { display: none; }
@media (max-width: 480px) {
  .seg-switch { display: flex; width: 100%; }
  .seg-switch a { flex: 1 1 auto; text-align: center; padding: .4rem .5rem; }
  .seg-switch .seg-full { display: none; }
  .seg-switch .seg-short { display: inline; }
}
/* A tied rank: a small "TIE" pill under the number. */
.rk-tie { display: block; width: max-content; margin: .25rem 0 0; padding: .1rem .42rem; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface-2); font-size: .6rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); line-height: 1.2; }

/* Top lists as illustrated cards (Rankings › Top lists). */
.lcards { list-style: none; margin: 0 0 1.75rem; padding: 0; display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr)); }
.lcard { display: flex; gap: .9rem; align-items: center; height: 100%; padding: .9rem 1rem; border: 1px solid var(--line); border-radius: 16px; background: var(--bg); color: var(--ink); text-decoration: none !important; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.lcard:hover { border-color: var(--line-strong); box-shadow: 0 10px 24px -16px rgba(15, 31, 54, .4); transform: translateY(-1px); }
.lcard:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.lcard-art { flex: none; display: grid; place-items: center; width: 3.6rem; height: 3.6rem; border-radius: 14px; }
.lcard-art .la-line { stroke: currentColor; }
.lcard-body { display: grid; gap: .2rem; min-width: 0; }
.lcard-title { font-size: .98rem; font-weight: 800; line-height: 1.25; letter-spacing: -.01em; }
.lcard:hover .lcard-title { color: var(--blue); }
.lcard-meta { font-size: .8rem; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tone-blue .lcard-art { background: var(--blue-50); color: var(--blue-700, #14325c); }
.tone-blue .la-fill { fill: #6aa5ec; }
.tone-gold .lcard-art { background: var(--gold-50); color: var(--gold-ink); }
.tone-gold .la-fill { fill: #e0b85a; }
.tone-teal .lcard-art { background: var(--teal-50); color: var(--teal-ink); }
.tone-teal .la-fill { fill: #5fb3bb; }
@media (prefers-reduced-motion: reduce) { .lcard { transition: none; } .lcard:hover { transform: none; } }

/* Rankings › By state: shaded map with a dot per ranked school, or a street map. */
.rkmap { position: relative; margin: .5rem 0 1rem; }
.rkmap-bar { display: inline-flex; gap: .4rem; margin: 0 0 .6rem; }
.rkmap-bar[hidden] { display: none; }
.rkmap-bar .sbs-opt { cursor: pointer; font: inherit; font-weight: 700; font-size: .88rem; }
.rkmap-bar .sbs-opt[aria-pressed="true"] { background: var(--blue); border-color: var(--blue); color: var(--on-accent, #fff); }
.rkmap-canvas { position: relative; height: clamp(22rem, 62vw, 38rem); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--surface-2); }
.rkmap-loading .rkmap-canvas::after { content: "Loading the street map…"; position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted); font-size: .9rem; }
.rkmap-tip .mt-cta { pointer-events: auto; }
.geomap-dots { pointer-events: none; }
.geomap-dots circle { stroke: var(--bg); stroke-width: 1.1; }
.geomap-dots .gd-c circle { fill: #1f5fae; }
.geomap-dots .gd-l circle { fill: #0f7c86; }
.geomap-dots .gd-h circle { fill: #c9a24a; }
.geomap-frame.has-lift .geomap-dots { opacity: .55; }
.rkmap-key { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; margin-top: .5rem; font-size: .82rem; color: var(--muted); }
.rkmap-key i { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; margin-right: .35rem; vertical-align: -.05rem; box-shadow: 0 0 0 1.5px var(--bg); }
.rkmap-key .gk-c { background: #1f5fae; } .rkmap-key .gk-l { background: #0f7c86; } .rkmap-key .gk-h { background: #c9a24a; }
.rk-states { list-style: none; margin: 0; padding: 0; columns: 4 11rem; column-gap: 1.5rem; font-size: .92rem; }
.rk-states li { padding: .18rem 0; break-inside: avoid; }
.rk-states .muted { font-size: .8rem; }
.rk-hub-ico.emb { background: var(--gold-50); }
.rk-hub-ico.emb .emblem { height: 1.6rem; width: auto; }
/* Scores always take three digits' width, so the grade boxes line up whether a score is 82 or 100. */
.rk-gs .rk-n { display: inline-block; min-width: 3ch; text-align: right; font-variant-numeric: tabular-nums; }
/* Sliding tab highlight (public/js/rankings-tabs.js): one pill glides between tabs; tabs keep their size. */
.rk-tabs { position: relative; }
.rk-tabs.has-ind a, .rk-tabs.has-ind a[aria-selected="true"], .rk-tabs.has-ind a:hover { background: transparent; transform: none !important; }
.rk-tabs.has-ind a { position: relative; z-index: 1; transition: color .3s ease; -webkit-tap-highlight-color: transparent; }
.rk-tabs.has-ind a:hover:not([aria-selected="true"]) { color: var(--ink); }
.rk-tabs.has-ind a .rk-count { transition: background .3s ease, color .3s ease; }
.rk-ind { position: absolute; top: .3rem; bottom: .3rem; left: 0; width: 0; border-radius: 999px; background: var(--btn-bg); box-shadow: 0 6px 16px -8px rgba(31, 95, 174, .7); transition: transform .42s cubic-bezier(.22, 1, .36, 1), width .42s cubic-bezier(.22, 1, .36, 1); pointer-events: none; }
.rk-tabs:not(.ready) .rk-ind, .rk-tabs:not(.ready) a, .rk-tabs:not(.ready) .rk-count { transition: none !important; }
@media (prefers-reduced-motion: reduce) { .rk-ind, .rk-tabs.has-ind a { transition: none; } }

/* Top 20 / Top 50 at the top of Rankings (College Compass Guide, October 20, 2026). */
.rk-topus { margin: 1.5rem 0 2.5rem; }
.rk-topus h2 { margin-bottom: .75rem; }
.rk-topus-tabs, .rk-topus-n { margin: 0 .5rem .75rem 0; }
.rk-topus .seg-switch a { text-decoration: none !important; }
.rk-topus-more { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; margin-top: 1rem; }
@media (max-width: 480px) {
  .rk-topus-tabs { flex-wrap: nowrap; }
  .rk-topus-tabs a { flex: 1 1 0; min-width: 0; white-space: normal; line-height: 1.2; }
}