/* Habbo lookup profile (/habbo/{name}/).
   One card, three bands. The top band is two columns: the Habbo on a
   space (or equipped banner) stage and the dossier (motto, account age
   and status, badges, actions). The middle band is the activity rail,
   public rares and recent fishing as a row of tiles, which keeps the
   art-backed skill panels from butting against the stage art. The
   bottom band is those two skill panels, fishing and gardening, each
   with its XP graph on an inset dark card. Below 820px everything stacks
   and the page scrolls; nothing scrolls inside the card. Loaded after habbend.css, which
   keeps the shared lookup pieces (stage, pills, motto, meta, badges,
   tiles). */

/* ---------- Stage: name over art, the Habbo at native 2× pixels ---------- */

.habbo-lookup-result .auth-stage-scene {
  height: auto;
  min-height: 20rem;
  max-height: none;
  max-width: none;
  aspect-ratio: auto;
  padding: 0.85rem 1rem 0.9rem;
}

/* No equipped banner: the stage paints the theme default. Dark gets the
   winter forest, light (and paper) the snowball room. Both are 982x614
   scenes; at the stage's size cover shows nearly the full width, so the
   crop only has to pick the vertical band. Equipped backgrounds set
   --profile-bg and their own crop focus (--profile-bg-pos) inline. */
.habbo-lookup-result .auth-stage-scene.habbo-lookup-stage--default {
  --profile-bg: url('/assets/habbo-lookup-stage-forest.jpg?v=20261112a');
  --profile-bg-pos: center 62%;
}

html[data-theme="light"] .habbo-lookup-result .auth-stage-scene.habbo-lookup-stage--default,
html[data-theme="paper"] .habbo-lookup-result .auth-stage-scene.habbo-lookup-stage--default {
  --profile-bg: url('/assets/habbo-lookup-stage-snow.jpg?v=20261112a');
  --profile-bg-pos: center 40%;
}

/* The room. The imager's 128x220 canvas carries about 42px of empty
   space above the head (more or less with hats) and 6px under the feet,
   and the body sits 7px left of the canvas centre, so centring the canvas
   never centres the Habbo. Instead the figure is anchored by its feet on
   a floor line, on a lit tile, and the script at the foot of the page
   measures the figure's real edges and centres those. The name is a
   plaque at the feet with the hotel and status pills under it, so the
   art above stays clear. */
.habbo-lookup-result .auth-stage-scene {
  --habbo-stage-foot: 4.6rem;
}

.habbo-lookup-result .habbo-lookup-iso {
  display: block;
  padding: 0;
}

.habbo-lookup-result .auth-stage-scene .habbo-lookup-iso .habbo-lookup-avatar {
  position: absolute;
  left: 50%;
  top: auto;
  bottom: var(--habbo-stage-foot);
  width: 128px;
  height: 220px;
  margin: 0;
  transform: translateX(calc(-50% + var(--habbo-figure-dx, 7px)));
}

.habbo-lookup-result .habbo-lookup-avatar img {
  display: block;
  width: 128px;
  height: 220px;
  max-width: none;
  max-height: none;
  transform: none;
  filter: drop-shadow(0 3px 0 rgba(0, 0, 0, 0.35));
}

.habbo-lookup-result .auth-stage-scene .stage-copy {
  position: absolute;
  left: 1rem;
  right: 1rem;
  bottom: 0.85rem;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.3rem;
  min-width: 0;
  text-align: center;
  pointer-events: none;
}

.habbo-lookup-result .auth-stage-scene.has-profile-bg .stage-copy h1 {
  max-width: 100%;
  margin: 0;
  padding: 0.1rem 0.8rem;
  border-radius: 3px;
  border: 1px solid var(--control-border);
  background: var(--content-box-bg);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
  color: var(--fg);
  font-size: 1.1rem;
  line-height: 1.3;
  letter-spacing: 0;
  text-shadow: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.habbo-lookup-result .habbo-lookup-stage-meta {
  justify-content: center;
  margin: 0;
  pointer-events: auto;
}

/* ---------- Dossier ---------- */

.habbo-lookup-dossier {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  min-width: 0;
}

.habbo-lookup-dossier .habbo-lookup-block {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.habbo-lookup-dossier .habbo-lookup-block .label,
.habbo-lookup-dossier .habbo-lookup-badges-head .label {
  margin-bottom: 0.25rem;
}

.habbo-lookup-dossier .habbo-lookup-motto {
  display: flex;
  align-items: center;
  min-height: 2.4rem;
  padding: 0.45rem 0.65rem;
  overflow-wrap: anywhere;
}

/* Account age beside status, as two equal boxes. */
.habbo-lookup-dossier .habbo-lookup-meta--stack {
  grid-template-columns: 1fr 1fr;
  gap: 0.45rem;
}

.habbo-lookup-dossier .habbo-lookup-meta--stack > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 0.4rem 0.6rem;
}

.habbo-lookup-dossier .habbo-lookup-meta dt {
  margin-bottom: 0.1rem;
}

.habbo-lookup-dossier .habbo-lookup-meta dd {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.habbo-lookup-meta .habbo-lookup-chip-sub {
  display: block;
  margin-top: 0.1rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Badges head: label, count, and the show-all toggle on one line so the
   grid below keeps its two rows. */
.habbo-lookup-badges-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.2rem 0.6rem;
}

.habbo-lookup-badges-head .label {
  margin-bottom: 0;
}

.habbo-lookup-badges-summary {
  flex: 1 1 auto;
  color: var(--muted);
  font-family: var(--font-pixel);
  font-size: 0.66rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  -webkit-font-smoothing: none;
  -moz-osx-font-smoothing: unset;
}

.habbo-lookup-badges-more {
  min-height: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  color: var(--accent);
  font-family: var(--font-pixel);
  font-size: 0.66rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  cursor: pointer;
  -webkit-font-smoothing: none;
  -moz-osx-font-smoothing: unset;
}

.habbo-lookup-badges-more:hover {
  text-decoration: underline;
  background: none;
  transform: none;
}

.habbo-lookup-badges-more[hidden] {
  display: none;
}

.habbo-lookup-dossier .habbo-lookup-badges--grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, 44px);
  justify-content: start;
  gap: 6px;
  width: 100%;
  min-width: 0;
}

.habbo-lookup-dossier .habbo-lookup-badges--grid li {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
}

.habbo-lookup-dossier .habbo-lookup-badges--grid li[hidden] {
  display: none;
}

.habbo-lookup-dossier .habbo-lookup-badges--grid img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

.habbo-lookup-dossier .habbo-lookup-badges--grid li.is-seen,
.habbo-lookup-dossier .habbo-lookup-badges--grid li.is-seen:hover {
  opacity: 1;
}

.habbo-lookup-dossier .habbo-lookup-badges--grid.is-expanded {
  overflow-y: auto;
  max-height: 6.2rem;
  overscroll-behavior: contain;
}

.habbo-lookup-dossier .habbo-lookup-actions {
  margin-top: auto;
  padding-top: 0.1rem;
}

.habbo-lookup-dossier .habbo-lookup-actions .btn {
  min-height: 1.9rem;
  padding-top: 0.3rem;
  padding-bottom: 0.2rem;
  font-size: 0.78rem;
}

/* ---------- Side rail: public rares, recent fishing ---------- */

.habbo-lookup-side {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  min-width: 0;
}

.habbo-lookup-activity {
  margin: 0;
}

.habbo-lookup-activity-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.3rem 0.75rem;
  margin-bottom: 0.5rem;
}

.habbo-lookup-activity-head .app-dashboard-heading,
.habbo-lookup-activity .section-head h2.app-dashboard-heading {
  margin: 0;
  color: var(--fg);
  font-size: 0.88rem;
}

.habbo-lookup-activity-head > p {
  margin: 0;
}

.habbo-lookup-side .habbo-lookup-activity-head {
  margin-bottom: 0.2rem;
}

/* Plain rows, not tiles: the heading already says what each row is, so
   the mark and kicker go, and the list fits the band without scrolling. */
.habbo-lookup-side .habbo-lookup-tiles {
  grid-template-columns: 1fr;
  gap: 0;
}

.habbo-lookup-side .habbo-lookup-tile {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.1rem;
  padding: 0.35rem 0;
  border: 0;
  border-top: 1px solid var(--panel-border);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.habbo-lookup-side a.habbo-lookup-tile:hover {
  background: transparent;
}

.habbo-lookup-side a.habbo-lookup-tile:hover .habbo-lookup-tile-title {
  color: var(--accent);
}

.habbo-lookup-side .habbo-lookup-tile-mark,
.habbo-lookup-side .habbo-lookup-kicker {
  display: none;
}

.habbo-lookup-side .habbo-lookup-tile-body {
  gap: 0.1rem;
}

.habbo-lookup-side .habbo-lookup-tile-title {
  font-size: 0.78rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.habbo-lookup-side .habbo-lookup-tile-meta {
  gap: 0.2rem 0.5rem;
  font-size: 0.66rem;
}

.habbo-lookup-empty-activity {
  margin: 0;
}

/* ---------- Skill panels: art behind, graph card in front ---------- */

.habbo-lookup-activity-stack {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.habbo-lookup-activity--skills {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  padding: 0;
}

/* The panels name themselves; the band heading is for screen readers. */
.habbo-lookup-activity--skills > .section-head {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.habbo-lookup-skills {
  display: grid;
  grid-template-columns: 1fr;
  flex: 1 1 auto;
  min-height: 0;
  gap: 0;
  margin: 0;
}

.habbo-lookup-skill {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-height: 15.5rem;
  min-width: 0;
  padding: 0.55rem 0.8rem 0.8rem;
  background-color: var(--content-box-bg);
  overflow: hidden;
  isolation: isolate;
}

.habbo-lookup-skill::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-position: center 32%;
  background-size: cover;
  background-repeat: no-repeat;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  /* The art is full at the top and fades into the panel over its whole
     height, so the graph card sits on a quieter floor. */
  -webkit-mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.72) 40%, rgba(0, 0, 0, 0.28) 75%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.72) 40%, rgba(0, 0, 0, 0.28) 75%, transparent 100%);
}

.habbo-lookup-skill--fishing::before {
  background-image: url("/assets/derby-registration.jpg?v=20260724a");
}

.habbo-lookup-skill--gardening::before {
  background-image: url("/assets/gardening-planting.jpg?v=20260829a");
  background-position: center 18%;
}

.habbo-lookup-skill > * {
  position: relative;
  z-index: 1;
}

/* Title at the right over the art, level pill beside it. */
.habbo-lookup-skill-top {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.55rem;
  min-height: 1.6rem;
}

.habbo-lookup-skill-top h3 {
  margin: 0;
  font-family: var(--font-pixel);
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: 0;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.7), 0 0 6px rgba(0, 0, 0, 0.45);
  -webkit-font-smoothing: none;
  -moz-osx-font-smoothing: unset;
}

.habbo-lookup-skill-top .derby-status {
  font-size: 0.66rem;
  line-height: 1.1rem;
  padding-top: 0.1rem;
  padding-bottom: 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

.habbo-lookup-skill--fishing .derby-status.is-live {
  color: #bae6fd;
  background: rgba(14, 116, 175, 0.72);
  border-color: rgba(125, 211, 252, 0.6);
}

.habbo-lookup-skill--gardening .derby-status.is-live {
  color: #bbf7d0;
  background: rgba(21, 128, 61, 0.72);
  border-color: rgba(134, 239, 172, 0.6);
}

.habbo-lookup-skill .derby-status.is-ended {
  color: #d5dde6;
  background: rgba(20, 24, 30, 0.72);
  border-color: rgba(255, 255, 255, 0.25);
}

/* The card follows the theme: the page's box colour, nearly opaque over
   the art, so the chart and controls inside use the ordinary tokens. */
.habbo-lookup-skill-card {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  gap: 0.3rem;
  min-height: 0;
  padding: 0.55rem 0.65rem 0.6rem;
  border-radius: 8px;
  border: 1px solid var(--content-box-border);
  background: color-mix(in srgb, var(--content-box-bg) 94%, transparent);
  box-shadow: var(--content-box-shadow), 0 10px 24px rgba(0, 0, 0, 0.18);
  color: var(--fg);
}

.habbo-lookup-skill-card .muted {
  color: var(--muted);
}

.habbo-lookup-skill-mid {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  gap: 0.25rem;
  min-height: 0;
}

.habbo-lookup-skill-chart.rare-price-history-chart {
  flex: 1 1 auto;
  height: auto;
  min-height: 5rem;
  border: 0;
  border-radius: 4px;
  box-shadow: none;
  background: transparent;
}

.habbo-lookup-skill-chart.rare-price-history-chart--live {
  overflow: hidden;
}

/* The graph is one clean line: no area wash, markers only on the latest
   sample. Guides and tick labels stay so the climb can be read. */
.habbo-lookup-skill-chart .rare-price-history-area {
  display: none;
}

.habbo-lookup-skill-chart .rare-price-history-dot:not(.rare-price-history-dot--last) {
  display: none;
}

/* Fishing draws in the theme's accent, gardening in its success green, so
   both lines read on the light card as well as the dark one. */
.habbo-lookup-skill--gardening .habbo-lookup-skill-card {
  --accent: var(--success);
}

.habbo-lookup-skill-empty {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  min-height: 5rem;
  margin: 0;
  text-align: center;
}

.habbo-lookup-skill-gain {
  margin: 0;
  min-height: 1.2em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Level and XP on the left, the next-level bar on the right, the pier
   and rod line under both. */
.habbo-lookup-skill-foot {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.2rem 0.8rem;
  align-items: center;
  padding-top: 0.35rem;
  border-top: 1px solid var(--content-box-border);
}

.habbo-lookup-skill-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem 0.75rem;
}

.habbo-lookup-skill-stats > div {
  display: flex;
  align-items: baseline;
  gap: 0.35rem;
  white-space: nowrap;
}

.habbo-lookup-skill-stats .label {
  color: var(--muted);
  font-family: var(--font-pixel);
  font-size: 0.62rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  -webkit-font-smoothing: none;
  -moz-osx-font-smoothing: unset;
}

.habbo-lookup-skill-stats strong {
  font-family: var(--font-pixel);
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: none;
  -moz-osx-font-smoothing: unset;
}

.habbo-lookup-skill-progress {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
}

.habbo-lookup-skill-progress:empty {
  display: none;
}

.habbo-lookup-skill-bar {
  flex: 1 1 auto;
  min-width: 2.5rem;
  height: 0.4rem;
  border-radius: 999px;
  border: 1px solid var(--control-border);
  background: var(--inset-bg);
  overflow: hidden;
}

.habbo-lookup-skill-bar-fill {
  display: block;
  height: 100%;
  min-width: 0;
  border-radius: inherit;
  background: var(--accent, #3d8bfd);
}

.habbo-lookup-skill-next {
  flex: 0 0 auto;
  margin: 0;
  white-space: nowrap;
}

.habbo-lookup-skill-extras {
  margin: 0;
  min-height: 1.2em;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---------- Stacked (phone and narrow tablet) ---------- */

@media (max-width: 819px) {
  .habbo-lookup-result.auth-shell {
    grid-template-columns: 1fr;
    gap: 0.85rem;
    min-height: 0;
  }

  .habbo-lookup-dossier {
    padding: 0.85rem 0.9rem;
  }

  /* The rail sits between the top band and the skills, so it spaces
     itself off the dossier like the stack does. */
  .habbo-lookup-side {
    margin-top: 0.85rem;
    padding: 0;
  }

  .habbo-lookup-activity-stack {
    margin-top: 0.85rem;
    gap: 0.85rem;
  }

  .habbo-lookup-skills {
    gap: 0.85rem;
  }

  .habbo-lookup-skill {
    min-height: 16rem;
    border-radius: var(--content-box-radius);
    border: 1px solid var(--content-box-border);
    box-shadow: var(--content-box-shadow);
  }
}

@media (min-width: 560px) and (max-width: 819px) {
  .habbo-lookup-skills {
    grid-template-columns: 1fr 1fr;
  }
}

/* Narrow card: level and XP on one row, the next-level bar under them. */
@media (max-width: 559px) {
  .habbo-lookup-skill-foot {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ---------- The card (desktop) ---------- */

@media (min-width: 820px) {
  /* The result card runs 5rem taller than the imager card so the stage,
     the dossier (three-line meta boxes, two badge rows, the actions) and
     both skill panels fit without scrolling. That is a floor, not a lock:
     when a hotel's language needs another line in the dossier, the top
     band and the card grow with it rather than clipping. The page-top
     offset is unchanged, so the header stays where every page puts it. */
  .habbo-centered-page .habbo-wrap--result .habbo-centered-main {
    flex-basis: auto;
    min-height: calc(var(--habbo-centered-card-h, 579px) + 5rem);
  }

  /* Same search as the landing hero (habbend.css styles both): the
     field with Look up inside it and the EN / ES / BR track. */
  .habbo-centered-page .habbo-lookup-toolbar-bar {
    margin: 0;
    padding: 1.1rem 1.1rem 1rem;
    border-bottom: 1px solid var(--content-box-border);
    background: linear-gradient(180deg, color-mix(in srgb, var(--fg) 4%, transparent), transparent);
  }

  .habbo-centered-page .habbo-lookup-toolbar-bar .habbo-lookup-form .rares-filter-input {
    max-width: none;
  }

  /* Top band: stage | dossier, equal halves. The row is as tall as the
     dossier needs (a 19rem floor keeps the Habbo's feet on the stage), so
     a one-row badge wall gives a short band and a two-row one grows it. */
  .habbo-centered-page .habbo-lookup-result.app-profile-shell {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: minmax(19rem, auto);
    gap: 0;
    flex: 0 0 auto;
    min-height: 0;
    margin: 0;
    border-bottom: 1px solid var(--content-box-border);
  }

  .habbo-centered-page .habbo-lookup-result .auth-stage-scene {
    height: 100%;
    min-height: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    border-right: 1px solid var(--content-box-border);
  }

  .habbo-centered-page .habbo-lookup-dossier {
    padding: 0.8rem 0.9rem 0.75rem;
    min-height: 0;
  }

  /* Half the card is too narrow for the meta boxes beside the motto, so
     the dossier runs top to bottom: motto, then account age and last
     online as two equal boxes, then the badge wall, then the actions. */
  .habbo-centered-page .habbo-lookup-dossier-top {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.45rem;
  }

  /* Middle band: public rares and recent fishing as one text line each,
     label first, entries separated by middots. No tiles, marks or pills:
     the band stays two short rows (one, or a single muted line, when the
     Habbo has nothing on Habbend yet) and divides the stage art from the
     skill art. */
  .habbo-centered-page .habbo-lookup-side {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-height: 0;
    padding: 0.5rem 1rem 0.55rem;
    border-bottom: 1px solid var(--content-box-border);
  }

  /* Label in a fixed column so the two rows line up; entries wrap after it. */
  .habbo-centered-page .habbo-lookup-side .habbo-lookup-activity {
    display: grid;
    grid-template-columns: 7.5rem minmax(0, 1fr);
    align-items: baseline;
    gap: 0 0.5rem;
    min-width: 0;
  }

  .habbo-centered-page .habbo-lookup-side .habbo-lookup-activity-head {
    gap: 0.3rem;
    margin: 0;
    line-height: 1.5;
  }

  .habbo-centered-page .habbo-lookup-side .habbo-lookup-activity-head .app-dashboard-heading {
    font-family: var(--font-pixel);
    font-size: 0.68rem;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted);
    -webkit-font-smoothing: none;
    -moz-osx-font-smoothing: unset;
  }

  .habbo-centered-page .habbo-lookup-side .habbo-lookup-activity-head > p {
    display: none;
  }

  .habbo-centered-page .habbo-lookup-side .habbo-lookup-tiles {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.1rem 0;
    min-width: 0;
  }

  .habbo-centered-page .habbo-lookup-side .habbo-lookup-tile {
    display: inline-flex;
    align-items: baseline;
    gap: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  /* Separator after each entry but the last, so a wrapped line never
     starts with a dot. */
  .habbo-centered-page .habbo-lookup-side .habbo-lookup-tile:not(:last-child)::after {
    content: "\00b7";
    margin: 0 0.5rem;
    color: var(--muted);
  }

  .habbo-centered-page .habbo-lookup-side a.habbo-lookup-tile:hover {
    background: transparent;
  }

  .habbo-centered-page .habbo-lookup-side .habbo-lookup-tile-mark,
  .habbo-centered-page .habbo-lookup-side .habbo-lookup-kicker {
    display: none;
  }

  .habbo-centered-page .habbo-lookup-side .habbo-lookup-tile-body {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0 0.4rem;
  }

  .habbo-centered-page .habbo-lookup-side .habbo-lookup-tile-title {
    font-size: 0.78rem;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }

  .habbo-centered-page .habbo-lookup-side .habbo-lookup-tile-meta {
    flex-wrap: nowrap;
    gap: 0 0.4rem;
    font-size: 0.68rem;
    white-space: nowrap;
  }

  /* "7 golden" as plain gold text, not a pill. */
  .habbo-centered-page .habbo-lookup-side .habbo-lookup-pill {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    font-size: 0.68rem;
    color: var(--warn);
  }

  .habbo-centered-page .habbo-centered-card .habbo-lookup-activity {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    margin: 0;
    padding: 0;
  }

  /* Bottom band: fishing | gardening, each filling its half. */
  .habbo-centered-page .habbo-lookup-activity-stack {
    flex: 1 1 auto;
    min-height: 0;
  }

  .habbo-centered-page .habbo-lookup-skills {
    grid-template-columns: 1fr 1fr;
    min-height: 15.5rem;
  }

  .habbo-centered-page .habbo-lookup-skill {
    min-height: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .habbo-centered-page .habbo-lookup-skill--fishing {
    border-right: 1px solid var(--content-box-border);
  }
}