.card-library { padding: 9rem 0 4rem; min-height: 70vh; }
.library-filters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; padding: 1.5rem; border: 1px solid var(--mt-border); border-radius: 1rem; background: var(--mt-bg-secondary); margin-top: 2rem; }
.library-filters label { display: block; font-weight: 600; margin-bottom: .5rem; }
.library-name { grid-column: 1 / -1; }
.library-card-search { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0,3fr) minmax(0,1fr); gap: 1rem; }
.library-card-search > .library-name { grid-column: auto; }
.library-card-search > div { min-width: 0; }
@media(max-width:767.98px) { .library-card-search { grid-template-columns: 1fr; } }

.library-filter-actions { grid-column: 1 / -1; display: flex; gap: .75rem; flex-wrap: wrap; }
.library-results { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin: 2rem 0 1.25rem; }
.library-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(170px,1fr)); gap: 1.5rem; }
.library-card { min-width: 0; }
.library-card-visual { display: block; width: 100%; padding: 0; border: 1px solid var(--mt-border); border-radius: .75rem; overflow: hidden; background: var(--mt-surface); color: var(--mt-text); aspect-ratio: 488 / 680; transition: transform .15s; }
.library-card-visual:hover { transform: translateY(-3px); border-color: var(--mt-primary); }
.library-card-visual:focus-visible { outline: 3px solid var(--mt-primary); outline-offset: 4px; }
.library-card-visual img { width: 100%; height: 100%; object-fit: contain; }
.library-placeholder { display: flex; height: 100%; align-items: center; justify-content: center; flex-direction: column; padding: 1rem; gap: 1rem; }
.library-placeholder i { font-size: 2.5rem; color: var(--mt-primary); }
.library-placeholder small, .library-card p { color: var(--mt-text-secondary); }
.library-card h2 { font-size: .95rem; font-weight: 700; margin: .85rem 0 .35rem; }
.library-card p { font-size: .8rem; margin-bottom: .25rem; }
.library-empty { padding: 3rem; text-align: center; background: var(--mt-surface); border-radius: 1rem; }
.library-pagination { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-top: 2.5rem; flex-wrap: wrap; }
.library-preview { width: 100%; height: auto; border-radius: .75rem; }
@media(min-width: 992px) { .library-filters { grid-template-columns: repeat(4,minmax(0,1fr)); } .library-name { grid-column: span 2; } .library-filter-actions { grid-column: span 2; align-items: end; } }
@media(max-width: 575.98px) { .card-library { padding-top: 7rem; } .library-filters { grid-template-columns: 1fr; padding: 1rem; } .library-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; } }
@media(prefers-reduced-motion: reduce) { .library-card-visual { transition: none; } }
.library-colors { min-width: 0; }
.library-colors legend { font-size: 1rem; font-weight: 600; margin-bottom: .5rem; }
.library-color-options { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.library-color-options label { display: flex; align-items: center; justify-content: center; min-width: 2.5rem; height: 2.5rem; margin: 0; padding: .35rem; border: 1px solid var(--mt-border); border-radius: .5rem; cursor: pointer; background: var(--mt-surface); }
.library-color-options .ms { font-size: 1.4rem; }
.library-color-options .library-color-all { font-size: .75rem; padding-inline: .6rem; }
.library-color-options input:checked + label { border-color: var(--mt-primary); box-shadow: 0 0 0 1px var(--mt-primary); background: var(--mt-surface-hover); }
.library-color-options input:focus-visible + label { outline: 3px solid var(--mt-primary); outline-offset: 3px; }
.library-card-frame { position: relative; }
.library-flip { position: absolute; right: .5rem; bottom: .5rem; border: 1px solid var(--mt-primary); border-radius: 50%; width: 2.5rem; height: 2.5rem; background: var(--mt-bg); color: var(--mt-primary); font-size: 1.3rem; }
.library-flip:hover { background: var(--mt-surface-hover); }
.library-flip:focus-visible { outline: 3px solid var(--mt-primary); outline-offset: 3px; }
.library-card-visual { text-decoration: none; }
.library-card h2 a { color: var(--mt-text); text-decoration: none; }
.library-card h2 a:hover { color: var(--mt-primary); }
.card-detail-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 2rem; align-items: start; }
.card-detail-art { max-width: 28rem; width: 100%; margin-inline: auto; }
.card-turn-image { position: relative; display: block; width: 100%; padding: 0; border: 0; border-radius: .8rem; background: var(--mt-surface); overflow: hidden; }
.card-turn-image:disabled { cursor: default; }
.card-turn-image img { width: 100%; height: auto; aspect-ratio: 488 / 680; object-fit: contain; }
.card-turn-icon { position: absolute; right: .75rem; bottom: .75rem; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--mt-bg); color: var(--mt-primary); border: 1px solid var(--mt-primary); font-size: 1.3rem; }
.card-turn-image:focus-visible { outline: 3px solid var(--mt-primary); outline-offset: 4px; }
.card-facts { margin-block: 1rem 1.5rem; }
.card-facts > div { display: grid; grid-template-columns: minmax(7rem, .8fr) minmax(0, 1.2fr); gap: 1rem; padding-block: .6rem; border-bottom: 1px solid var(--mt-border); }
.card-facts dt { color: var(--mt-text-secondary); font-weight: 500; }
.card-facts dd { margin: 0; overflow-wrap: anywhere; }
.card-rules { white-space: pre-line; }
.mtg-inline-symbol { display: inline-block; white-space: nowrap; margin-inline: .08em; font-size: .9em; }
.card-legalities { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .4rem 1rem; list-style: none; padding: 0; }
.card-legalities li { display: flex; justify-content: space-between; gap: .5rem; font-size: .8rem; padding-block: .35rem; border-bottom: 1px solid var(--mt-border); }
.legality-legal { color: var(--mt-success); }
.legality-banned, .legality-notlegal { color: var(--mt-danger); }
.legality-restricted { color: var(--mt-warning); }
.card-detail-sections { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.5rem; margin-top: 2rem; }
.card-detail-panel { padding: 1.5rem; background: var(--mt-bg-secondary); border: 1px solid var(--mt-border); border-radius: 1rem; }
.card-printings { padding-left: 1.25rem; }
.card-printings li { margin-bottom: .6rem; }
.mtg-mana-cost .ms { margin-inline: .1rem; }
@media(max-width: 767.98px) { .card-detail-layout, .card-detail-sections { grid-template-columns: 1fr; } .card-detail-art { max-width: 20rem; } }
@media(max-width: 399.98px) { .card-legalities { grid-template-columns: 1fr; } }
.library-explore-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.5rem}
.library-explore-card{display:flex;flex-direction:column;padding:.65rem;border:1px solid var(--mt-border);border-radius:1.15rem;background:linear-gradient(145deg,var(--mt-surface),var(--mt-bg-secondary));box-shadow:0 8px 24px #0003;transition:transform .22s,border-color .22s,box-shadow .22s}
.library-explore-card:hover,.library-explore-card:focus-within{transform:translateY(-5px);border-color:var(--mt-primary);box-shadow:0 14px 32px #0005}
.library-explore-card .library-card-frame{border-radius:.8rem;overflow:hidden}
.library-explore-card .library-card-visual{border:0;transition:filter .25s}
.library-explore-card .library-card-visual:hover{transform:none;filter:brightness(1.06)}
.library-card-info{display:flex;flex-direction:column;flex:1;padding:.25rem .45rem 0}
.library-card-info h2{font-size:1rem;line-height:1.4;margin:.75rem 0 .55rem}
.library-card-info .card-edition{display:flex;align-items:center;gap:.6rem;min-height:2rem;line-height:1.4}
.library-card-info .set-symbol{width:28px;height:28px;object-fit:contain;flex-shrink:0}
.library-card-info>.text-secondary{font-size:.7rem;margin-bottom:.75rem}
.library-explore-card .content-actions-mini{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.3rem;margin:.85rem 0 0;padding:.65rem 0 .15rem;border-top:1px solid var(--mt-border);margin-top:auto}
.library-explore-card .content-metric{justify-content:center;border:0;border-radius:.5rem;padding:.55rem .2rem;background:var(--mt-bg-secondary);color:var(--mt-text-secondary);font-size:.8rem;min-height:44px}
.library-explore-card .content-metric i{color:var(--mt-primary);font-size:1rem}
.library-explore-card .library-like:hover,.library-explore-card .library-like.is-liked{background:var(--mt-surface-hover);color:var(--mt-primary)}
.library-like:focus-visible{outline:2px solid var(--mt-primary);outline-offset:2px}
#library-load-more{flex-direction:column;min-height:6rem;color:var(--mt-text-secondary)}
.library-load-status{margin:0}
@media(max-width:575.98px){.library-explore-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.library-explore-card{padding:.4rem;border-radius:.85rem}.library-card-info{padding-inline:.15rem}.library-card-info h2{font-size:.85rem;overflow-wrap:anywhere}.library-card-info .card-edition{font-size:.7rem;overflow-wrap:anywhere}.library-card-info .set-symbol{width:22px;height:22px}.library-explore-card .content-metric{font-size:.7rem;gap:.25rem}}
@media(prefers-reduced-motion:reduce){.library-explore-card,.library-explore-card .library-card-visual{transition:none}.library-explore-card:hover,.library-explore-card:focus-within{transform:none}}
.library-color-options button{display:flex;align-items:center;justify-content:center;min-height:44px;margin:0;padding:.35rem .6rem;border:1px solid var(--mt-border);border-radius:.5rem;background:var(--mt-surface);color:var(--mt-text)}
.library-color-options button[aria-pressed=true]{border-color:var(--mt-primary);box-shadow:0 0 0 1px var(--mt-primary)}
.library-color-options button:focus-visible{outline:3px solid var(--mt-primary);outline-offset:3px}
.library-color-options label{min-height:44px;min-width:44px}
.library-colors legend{float:none;width:auto}.library-colors .library-color-options{width:100%;clear:both}

/* Compact card preview */
#card-preview .modal-dialog{max-width:780px;margin-inline:auto;padding-inline:.75rem}
#card-preview .modal-content{border:1px solid var(--mt-border);border-radius:1.25rem;background:var(--mt-bg-secondary);box-shadow:0 24px 80px #0008;overflow:hidden}
#card-preview .modal-header{padding:1rem 1.25rem;border-color:var(--mt-border);gap:1rem;background:var(--mt-surface)}
#card-preview .modal-title{font-size:1.05rem!important;font-weight:700;line-height:1.4}
#card-preview .btn-close{min-width:32px;min-height:32px;margin:0;padding:.35rem}
#card-preview .modal-body{padding:1.25rem}
#card-preview .modal-footer{padding:.75rem 1.25rem;border-color:var(--mt-border)}
#card-preview .modal-footer .btn{font-size:.85rem;padding:.6rem 1rem}
.card-quickview{display:grid;grid-template-columns:235px minmax(0,1fr);gap:1.25rem;align-items:start}
.card-quickview-art{position:sticky;top:0}
.card-quickview-art .card-turn-image{box-shadow:0 10px 28px #0006;border:1px solid var(--mt-border)}
.card-quickview-art .card-turn-icon{width:44px;height:44px;right:.5rem;bottom:.5rem}
.card-quickview-heading{display:flex;justify-content:space-between;align-items:center;gap:.5rem;flex-wrap:wrap}
.card-quickview-game{font-size:.7rem;color:var(--mt-text-secondary)}
.card-quickview-mana{display:flex;align-items:center;gap:.2rem}
.card-quickview-type{font-size:.92rem;font-weight:600;line-height:1.45;margin:.5rem 0 .85rem}
.card-quickview-set{display:flex;align-items:center;gap:.65rem;padding:.7rem;border:1px solid var(--mt-border);border-radius:.75rem;background:var(--mt-surface);text-decoration:none;font-size:.8rem}
.card-quickview-set>span{flex:1;min-width:0}
.card-quickview-set small{display:block;color:var(--mt-text-secondary);font-size:.65rem;margin-top:.15rem}
.card-quickview-facts{display:flex;flex-wrap:wrap;gap:.5rem;margin:.8rem 0}
.card-quickview-facts>div{padding:.45rem .65rem;border-radius:.5rem;background:var(--mt-surface);flex:1 0 auto}
.card-quickview-facts dt{font-size:.65rem;font-weight:500;color:var(--mt-text-secondary)}
.card-quickview-facts dd{font-size:.8rem;font-weight:600;margin:.15rem 0 0}
.card-quickview-rules{border-left:2px solid var(--mt-primary);padding:.7rem .85rem;background:var(--mt-surface);border-radius:0 .65rem .65rem 0}
.card-quickview-rules h3{font-size:.65rem;color:var(--mt-text-secondary);margin-bottom:.5rem}
.card-quickview-rules p{font-size:.82rem;line-height:1.65;margin:0}
.card-quickview-legalities{font-size:.78rem;margin-top:.8rem}
.card-quickview-legalities summary{cursor:pointer;padding:.55rem 0;color:var(--mt-primary)}
.card-quickview-note{font-size:.68rem;color:var(--mt-text-secondary);line-height:1.5;margin:.5rem 0 0}
.card-quickview .content-actions{gap:.5rem .8rem;padding:.7rem 0 0;margin:.8rem 0 0;border-bottom:0;font-size:.72rem}
.card-quickview .content-buttons{margin-left:0;flex-basis:100%}
.card-quickview .content-stats-note{font-size:.63rem}
@media(max-width:575.98px){#card-preview .modal-dialog{padding-inline:.5rem;margin:.5rem;max-width:none}#card-preview .modal-header{padding:.75rem 1rem}#card-preview .modal-body{padding:1rem}#card-preview .modal-footer{padding:.65rem 1rem}.card-quickview{grid-template-columns:minmax(0,1fr);gap:1rem}.card-quickview-art{position:static;max-width:145px;margin-inline:auto;width:100%}.card-quickview-type{margin-top:.4rem}.card-quickview-facts{gap:.4rem}.card-quickview-facts>div{padding:.4rem .6rem}.card-quickview-rules p{font-size:.8rem}}
#card-preview .modal-header .btn-close{margin-left:auto;flex-shrink:0}@media(max-width:575.98px){.card-quickview-art{max-width:120px}}

.library-advanced { grid-column: 1 / -1; min-width: 0; border: 1px solid var(--mt-border); border-radius: .75rem; padding: .85rem 1rem; background: var(--mt-bg-secondary); }
.library-advanced summary { cursor: pointer; font-weight: 600; color: var(--mt-primary); }
.library-advanced summary:focus-visible { outline: 2px solid var(--mt-primary); outline-offset: 4px; }
.library-advanced-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin-top: 1rem; }
.library-advanced small { display: block; margin-top: .4rem; }
@media(max-width:575.98px) { .library-advanced-grid { grid-template-columns: 1fr; } }

.library-special-options { grid-column: 1 / -1; min-width: 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; padding-top: 1rem; border-top: 1px solid var(--mt-border); }
.library-special-options legend { float: none; width: auto; font-size: .78rem; font-weight: 700; margin-bottom: .75rem; }
.library-filters .library-option { display: flex; align-items: flex-start; gap: .75rem; margin: 0; padding: .85rem; border: 1px solid var(--mt-border); border-radius: .65rem; cursor: pointer; font-weight: 400; }
.library-option:has(input:checked) { border-color: var(--mt-primary); background: var(--mt-surface); }
.library-option input { width: 1.1rem; height: 1.1rem; flex-shrink: 0; margin-top: .15rem; accent-color: var(--mt-primary); }
.library-option small { color: var(--mt-text-secondary); font-size: .75rem; }
@media(max-width:575.98px) { .library-special-options { grid-template-columns: 1fr; } }

.library-rarities { order: 0; min-width: 0; }
.library-advanced-grid > .library-colors { order: 1; grid-column: auto; }
.library-type-filter { order: 2; }
.library-format-filter { order: 3; }
.library-advanced-grid > .library-special-options { order: 4; }
.library-rarities legend { float: none; width: auto; font-size: .78rem; font-weight: 700; margin-bottom: .5rem; }
.library-rarity-options { width: 100%; clear: both; display: flex; flex-wrap: wrap; gap: .65rem; padding: .35rem 0; }
.library-rarity { flex: 0 0 2.65rem; width: 2.65rem; height: 2.65rem; border: 2px solid transparent; border-radius: 50%; font-weight: 800; font-size: .85rem; display: inline-flex; align-items: center; justify-content: center; transition: transform .15s; }
.rarity-common { background: var(--mt-rarity-common); color: var(--mt-bg); }
.rarity-uncommon { background: var(--mt-rarity-uncommon); color: var(--mt-bg); }
.rarity-rare { background: var(--mt-rarity-rare); color: var(--mt-bg); }
.rarity-mythic { background: var(--mt-rarity-mythic); color: var(--mt-text); }
.rarity-special { background: var(--mt-rarity-special); color: var(--mt-text); }
.rarity-bonus { background: var(--mt-rarity-bonus); color: var(--mt-text); }
[data-library-rarity]:checked + .library-rarity { outline: 3px solid var(--mt-primary); outline-offset: 3px; }
[data-library-rarity]:focus-visible + .library-rarity { outline: 3px solid var(--mt-primary); outline-offset: 3px; }
.library-rarity:hover { transform: translateY(-2px); }
@media(prefers-reduced-motion:reduce) { .library-rarity { transition: none; } }

.library-filters .library-rarity { display: inline-flex; margin-bottom: 0; cursor: pointer; }

.library-card-visual { position: relative; }
.library-price-badge { position: absolute; bottom: -.25rem; left: 50%; transform: translateX(-50%); display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .25rem .55rem; width: max-content; max-width: calc(100% - 1rem); padding: .3rem .6rem; border: 1px solid var(--mt-border); border-radius: 2rem; background: var(--mt-bg); color: var(--mt-text); font-size: .75rem; font-weight: 700; white-space: nowrap; box-shadow: 0 2px 8px #0006; }
.library-price-badge i { color: var(--mt-primary); font-size: .65rem; }
.library-price-missing { color: var(--mt-text-secondary); font-size: .65rem; font-weight: 400; }
.collection-owned-languages { bottom: 2.6rem; }

.library-card-visual:has(.library-price-badge){overflow:visible}.library-card-visual>img{border-radius:.75rem}.library-price-badge{z-index:2}

/* Match the deck and preconstructed catalogue heading and filter typography. */
.card-catalogue .page-heading { margin-bottom: 1.25rem; }
.card-catalogue .library-filters > div > label,
.card-catalogue .library-card-search > div > label,
.card-catalogue .library-advanced-grid > div > label,
.card-catalogue .library-filters fieldset > legend {
  font-size: .7rem;
  font-weight: 600;
  color: var(--mt-text-secondary);
  margin-bottom: .3rem;
}
.card-catalogue .library-filters .form-control,
.card-catalogue .library-filters .form-select,
.card-catalogue .library-filter-actions > .btn {
  min-height: 2.8rem;
  padding-block: .55rem;
  font-size: .8rem;
}