/* RF-AVALON Market V61.0.96
   Visual-only polish on top of V61.0.95:
   - add breathing room between EXP progress and PT/Skills/Magic tabs;
   - normalize all animated grade outlines to the same thin 1px tracer geometry;
   - frame item-duration and character-minimum-price rules like the existing offline rule. */

/* The EXP panel must read as its own block instead of sticking to the tabs. */
.character-details.v95-experience-relocated .character-exp-overview-v95 {
  margin-bottom: 12px !important;
}

/*
 * V94 used a 2px masked tracer for graded items while V95 grade-0 used 1px.
 * Keep the animation, but make every grade frame visually the same thickness.
 */
.equipment-slot.graded::before,
.equipment-slot.filled:not(.graded):not(.v61-expired-temporary):not(.is-unavailable)::before {
  inset: -2px !important;
  border-width: 1px !important;
}

.equipment-slot.graded::after,
.equipment-slot.filled:not(.graded):not(.v61-expired-temporary):not(.is-unavailable)::after {
  inset: -2px !important;
  padding: 1px !important;
  border-radius: 2px !important;
}

/* Slightly restrain only the outer glow; the grade colour itself stays bright. */
.equipment-slot.graded::after {
  filter:
    drop-shadow(0 0 1.5px var(--item-grade-color))
    drop-shadow(0 0 3px color-mix(in srgb, var(--item-grade-color) 34%, transparent)) !important;
}

.equipment-slot.graded.filled:hover::after,
.equipment-slot.graded.filled:focus-visible::after {
  filter:
    drop-shadow(0 0 2px var(--item-grade-color))
    drop-shadow(0 0 5px color-mix(in srgb, var(--item-grade-color) 58%, transparent)) !important;
}

/* Same card language as the framed offline requirement on the item market. */
.item-market-heading .item-duration-rule,
.page-heading:not(.item-market-heading) .market-rule {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  margin-top: 10px;
  padding: 7px 10px;
  border: 1px solid rgba(240, 163, 48, .48);
  border-radius: 5px;
  background: rgba(240, 163, 48, .09);
  color: #d3dbe7 !important;
  font-weight: 700;
  box-shadow: inset 0 1px rgba(255,255,255,.022);
}

.item-market-heading .item-duration-rule {
  margin-left: 8px !important;
}

.item-market-heading .item-duration-rule::before {
  content: "◷";
  color: #ffad16;
  font-size: 14px;
  line-height: 1;
}

.page-heading:not(.item-market-heading) .market-rule::before {
  content: "GP";
  display: grid;
  place-items: center;
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  border: 1px solid rgba(255, 173, 22, .72);
  border-radius: 50%;
  color: #ffc35b;
  background: rgba(240, 163, 48, .10);
  font-size: 7px;
  font-weight: 900;
  letter-spacing: -.02em;
}

.item-market-heading .item-duration-rule strong,
.page-heading:not(.item-market-heading) .market-rule strong {
  color: #ffc35b !important;
}

@media (max-width: 680px) {
  .character-details.v95-experience-relocated .character-exp-overview-v95 {
    margin-bottom: 10px !important;
  }

  .item-market-heading .item-duration-rule,
  .page-heading:not(.item-market-heading) .market-rule {
    width: 100%;
    margin-left: 0 !important;
  }
}