/* Incumbent WenKai 1.522 Regular, additive four-glyph patch; other type stays unchanged. */
@font-face {
  font-family: "Library Approved WenKai";
  src: url("./assets/fonts/library-wenkai-swamp-v2.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+6CBC, U+6CFD, U+9677, U+9631;
}

/* One quiet paper/ink environment behind every preserved item cutout. */
#home-screen ~ #item-library-panel.library-approved-v11 :is(.item-atlas-entry__art, .is-detail .library-detail__art) {
  isolation: isolate;
  position: relative;
  background: url("./assets/library-approved-v11/item-card-paper-clean-reference-v4.png") center / cover no-repeat !important;
  border-radius: 3px !important;
}
#home-screen ~ #item-library-panel.library-approved-v11 :is(.item-atlas-entry__art, .is-detail .library-detail__art)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url("./assets/library-approved-v11/ink-ground-v2.png") center bottom / cover no-repeat;
  opacity: .24;
  pointer-events: none;
}
#home-screen ~ #item-library-panel.library-approved-v11 :is(.item-atlas-entry__art, .is-detail .library-detail__art) img {
  position: relative;
  z-index: 1;
  object-fit: contain !important;
}
#home-screen ~ #item-library-panel.library-approved-v11 .library-detail__validity {
  font-variant-numeric: tabular-nums;
  white-space: normal !important;
  overflow-wrap: anywhere;
}
#home-screen ~ #item-library-panel.library-approved-v11 .library-detail__validity[data-expiring] {
  color: #942e20 !important;
}

/* Unequip confirmation: reuse the catalogue paper and the actual action frame. */
#item-library-panel .item-unequip-confirm {
  box-sizing: border-box; width: min(88vw, 360px); max-width: calc(100vw - 32px);
  padding: 24px 18px 18px; border: 14px solid transparent;
  border-image: url('./assets/secondary-unified-v1/frame.png') 96 stretch;
  background: url('./assets/library-approved-v11/item-list-paper-full-v6.png') center / calc(100% + 36px) auto;
  color: #4a2c1b; font-family: 'Library Approved WenKai', KaiTi, serif;
  box-shadow: 0 14px 32px #21170f66;
}
.item-unequip-confirm::backdrop { background: #21170f99; }
#item-library-panel .item-unequip-confirm h3 { margin: 0 0 16px; text-align: center; font-size: 24px; font-weight: 400; }
#item-library-panel .item-unequip-confirm p { margin: 0 0 24px; text-align: center; font-size: 18px; line-height: 1.5; }
#item-library-panel .item-unequip-confirm > div { display: flex; gap: 14px; }
#item-library-panel .item-unequip-confirm button {
  flex: 1; min-width: 0; min-height: 48px; padding: 4px 6px;
  font: inherit; font-size: 18px; color: #693a22; cursor: pointer;
  border: 7px solid transparent !important; border-radius: 0 !important;
  border-image: url('./assets/library-approved-v11/button-approved-v2.png') 80 100 stretch !important;
  background: #f6e6cd !important; box-shadow: none;
}
#item-library-panel .item-unequip-confirm button[data-confirm] {
  border-image-slice: 80 100 fill !important; color: #fff1ce; background: #902f23 !important;
}
/* The approved image's outer gold rim ends at source pixel 29.
   Keep its existing 80/100 slice geometry, exposing only that rim on cancel. */
#item-library-panel .item-unequip-confirm button[data-cancel] {
  position: relative;
  border-image: none !important;
}
#item-library-panel .item-unequip-confirm button[data-cancel]::before {
  content: "";
  position: absolute;
  inset: -7px;
  pointer-events: none;
  border: 7px solid transparent;
  border-image: url('./assets/library-approved-v11/button-approved-v2.png') 80 100 stretch;
  /* Same original-asset contour as the approved native Canvas button. */
  clip-path: polygon(evenodd,
    0 0, 100% 0, 100% 100%, 0 100%, 0 0,
    3.85px 2.5375px, 2.03px 5.25px,
    2.03px calc(100% - 5.25px), 3.85px calc(100% - 2.5375px),
    calc(100% - 3.85px) calc(100% - 2.5375px), calc(100% - 2.03px) calc(100% - 5.25px),
    calc(100% - 2.03px) 5.25px, calc(100% - 3.85px) 2.5375px,
    3.85px 2.5375px, 0 0);
}
#home-screen ~ #item-library-panel.library-approved-v11 .item-unequip-confirm button:focus-visible {
  outline: none !important; outline-offset: 0 !important;
  box-shadow: inset 0 0 0 2px #b58a4c;
}
#home-screen ~ #item-library-panel.library-approved-v11 .item-unequip-confirm button[data-cancel]:focus-visible {
  box-shadow: none;
}
#item-library-panel .item-unequip-confirm button[data-cancel]:focus-visible::before {
  filter: brightness(1.2);
}