/* 1025DEX Community v0.31.35 · css/binder.css · ausgelagert aus index.html */
/* ---------- Binder ---------- */
.page{margin-bottom:16px}
.page h3{margin:0 0 6px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.sheet{display:grid;grid-template-columns:repeat(var(--binder-cols,5),1fr);gap:5px;background:var(--panel);border:3px solid var(--line);border-radius:12px;padding:6px;box-shadow:var(--shadow)}
.slot{
  position:relative;aspect-ratio:.72;border-radius:6px;border:2px solid var(--line);
  background:var(--empty);overflow:hidden;display:block;
}
.slot.s-owned{background:var(--owned)}
.slot.s-wish{background:var(--wish)}
/* Kartenbild fuellt das ganze Feld, der Status sitzt als schmale Leiste unten drauf */
.slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.slot .ownart{width:100%;height:100%;object-fit:cover;display:block;opacity:.92}
.slot.hasart{outline:2px dashed rgba(255,255,255,.85);outline-offset:-4px}
.artbox{margin-top:10px;text-align:center;border:3px solid var(--line);border-radius:12px;background:var(--panel);padding:8px}
.artbox img{width:min(100%,170px);border-radius:8px;display:block;margin:0 auto 6px}
.slot .sil{object-fit:contain;padding:6%;
  filter:grayscale(1) contrast(.9) brightness(.75); opacity:.65; display:block}
html[data-theme="dark"] .slot .sil{filter:grayscale(1) contrast(.9) brightness(1.6); opacity:.5}
.slot.upg::after{content:"";position:absolute;top:0;right:0;border-width:0 13px 13px 0;
  border-style:solid;border-color:transparent var(--wish) transparent transparent;z-index:2}
.slot .no{position:absolute;top:1px;left:3px;z-index:2;font-size:8px;font-weight:800;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.85)}
.slot .ow{position:absolute;left:0;right:0;bottom:0;z-index:2;font-size:8px;font-weight:800;
  text-align:center;color:#fff;padding:2px 0;text-shadow:0 1px 1px rgba(0,0,0,.5)}
.slot .ow.s-owned{background:var(--owned)}
.slot .ow.s-wish{background:var(--wish)}
.slot.hit{outline:4px solid #ffd400;outline-offset:1px}
.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;font-weight:700}
.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;border:2px solid var(--line);vertical-align:-2px;margin-right:4px}