.library-section-tabs{display:flex;gap:24px;border-bottom:1px solid var(--line);margin:0 0 30px}.library-section-tabs a{padding:10px 2px 14px;font-weight:700;border-bottom:2px solid transparent}.library-section-tabs a[aria-current]{color:var(--teal);border-color:var(--teal)}.library-section-tabs a:hover{color:var(--teal)}
.locations-filters{display:flex;align-items:end;gap:18px;padding:24px;border:1px solid var(--line);border-radius:10px;background:var(--surface);margin-bottom:26px}.locations-filters label{display:flex;flex:1;flex-direction:column;gap:8px;font-size:12px;font-weight:700}.locations-filters input,.locations-filters select{width:100%;min-height:46px;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:5px;padding:10px 14px;font:inherit}.locations-filters .button{min-height:46px}.locations-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.location-entry{display:flex;flex-direction:column;padding:25px;border:1px solid var(--line);border-radius:10px;background:var(--surface);scroll-margin-top:25px}.location-entry h2{font-size:23px;letter-spacing:-.6px;line-height:1.25;margin:0 0 18px}.location-entry>p{color:var(--muted);font-size:14px;line-height:1.8;margin-bottom:24px}.location-tags{display:flex;flex-wrap:wrap;gap:7px;list-style:none;padding:0;margin:auto 0 0}.location-tags a{display:inline-block;padding:4px 9px;border:1px solid var(--line);border-radius:5px;font-size:10px;color:var(--teal)}.location-tags a:hover{border-color:var(--teal)}.locations-source{font-size:11px;color:var(--muted);line-height:1.8;margin:32px 0}.locations-source a{color:var(--teal)}
@media(max-width:1000px){.locations-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.locations-grid{grid-template-columns:1fr}.locations-filters{flex-direction:column;align-items:stretch}.location-entry{padding:22px}}

.library-section-tabs>.library-version{margin-left:auto;align-self:center;padding:5px 10px;border:1px solid var(--line);border-radius:30px;font-size:12px;font-weight:400;line-height:1.4;color:var(--muted);text-decoration:none;white-space:nowrap}.library-section-tabs>.library-version:hover{color:var(--teal);border-color:var(--teal)}

/* Rarity is a compact coloured ribbon in the card's top-right corner. */
.location-entry{position:relative;overflow:hidden;padding-top:34px}
.location-rarity{position:absolute;top:0;right:0;display:block;margin:0;padding:6px 14px 6px 23px;border:0;border-radius:0 9px 0 0;clip-path:polygon(12px 0,100% 0,100% 100%,0 100%);background:#a7a4ad;color:#19171c;font-size:11px;font-weight:700;line-height:1.5;max-width:85%}
.location-rarity[data-rarity=Rare]{background:#65cbb5}
.location-rarity[data-rarity=VeryRare]{background:#b39ada}
.location-rarity[data-rarity=UltraRare]{background:#c6a66b}
@media(max-width:760px){.location-entry{padding-top:34px}}

.locations-filters{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr) auto}.locations-filters label{min-width:0}.locations-filters input,.locations-filters select{box-sizing:border-box;min-width:0}@media(max-width:760px){.locations-filters{grid-template-columns:1fr}}

.locations-filters select{appearance:none;-webkit-appearance:none;padding-right:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23bcb5bf' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:16px 16px;background-position:right 13px center;cursor:pointer}
.locations-filters select:hover{border-color:var(--teal,#65cbb5)}
.locations-filters select:focus-visible{outline:2px solid var(--teal,#65cbb5);outline-offset:2px}
html[data-theme=light] .locations-filters select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23655a69' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}

/* Compact title beside a straight-edged rarity corner. */
.location-entry{padding:20px}
.location-entry-heading{display:flex;align-items:flex-start;gap:12px;margin:-20px -20px 16px;padding-left:20px;min-width:0}
.location-entry-heading h2{flex:1;min-width:0;font-size:18px;letter-spacing:-.3px;line-height:1.3;margin:0;padding-top:18px;overflow-wrap:anywhere}
.location-entry-heading .location-rarity{position:static;flex:none;max-width:48%;clip-path:none;padding:6px 10px;border-radius:0 9px 0 5px;text-align:center;font-size:10px}
