.toolbar {
  grid-template-columns: minmax(230px, 1fr) auto auto auto;
}

.sort-control {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border: 1px solid #333;
  color: #777;
  text-transform: uppercase;
  font: 9px var(--mono);
}

.sort-control select {
  border: 0;
  background: #111;
  color: #eee;
  font: 9px var(--mono);
  text-transform: uppercase;
  outline: none;
}

.save-fab {
  position: absolute;
  right: 50px;
  bottom: 10px;
  width: 34px;
  height: 34px;
  border: 0;
  background: #0b0b0bd9;
  color: #fff;
  font-size: 17px;
  cursor: pointer;
  opacity: 0;
  transform: translateY(5px);
  transition: .2s;
}

.save-fab.saved { color: var(--lime); }
.art-card:hover .save-fab, .save-fab:focus, .save-fab.saved { opacity: 1; transform: none; }
.art-image img { cursor: pointer; }
.placeholder-image { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; background:linear-gradient(135deg,#171717,#242424); color:#666; }
.placeholder-image span { font:28px var(--mono); color:#8d8d8d; }
.placeholder-image small { font:8px var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.art-placeholder .card-links span { color:#666; font:8px var(--mono); text-transform:uppercase; }
.card-title-button { border: 0; padding: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.listing-line { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px solid #292929; }
.listing-line strong { color: var(--lime); font: 13px var(--mono); }
.listing-line span { color: #666; font: 8px var(--mono); text-transform: uppercase; }
.card-links { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 12px; }
.card-links button, .card-links a { padding: 9px 7px; border: 1px solid #333; background: transparent; color: #aaa; text-align: center; text-decoration: none; font: 8px var(--mono); text-transform: uppercase; cursor: pointer; }
.card-links a { border-color: #634043; color: #ff8588; }
.proposal { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 10px; padding: 9px; border: 1px solid #6b571f; background: #261f0b; color: #d7c57a; font: 8px var(--mono); text-transform: uppercase; }
.proposal div { display: flex; gap: 5px; }
.proposal button { padding: 5px 7px; border: 1px solid #766428; background: transparent; color: #f1dd82; font: 8px var(--mono); text-transform: uppercase; cursor: pointer; }
.animated-tag { border-color: #8b62d8; background: #291c43; color: #c6a8ff; }
.category-tools { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 24px 5vw 0; }
.category-tools label { display: flex; align-items: center; gap: 10px; width: min(520px,100%); border-bottom: 1px solid #474747; color: #888; }
.category-tools input { width: 100%; border: 0; background: transparent; color: #fff; padding: 13px 0; outline: none; font: 11px var(--mono); }
.category-tools > span { color: #666; font: 9px var(--mono); text-transform: uppercase; }
.category-strip .category-scroll { display: grid; grid-template-columns: repeat(auto-fill,minmax(180px,1fr)); gap: 10px; max-height: 430px; margin: 0 5vw; padding: 20px 4px 6px 0; overflow-y: auto; align-content: start; }
.category-strip .category-card { width: auto; min-width: 0; height: 105px; }
.category-empty { grid-column: 1/-1; padding: 36px; border: 1px dashed #333; color: #777; text-align: center; font: 10px var(--mono); text-transform: uppercase; }
@media(max-width:680px){.category-tools{align-items:stretch;flex-direction:column}.category-tools>span{align-self:flex-end}.category-strip .category-scroll{grid-template-columns:repeat(2,minmax(0,1fr));max-height:360px}.category-strip .category-card{height:96px;padding:12px}.category-strip .category-card strong{font-size:15px}}
.hero-token i { margin-left: 10px; color: #777; font-style: normal; }
.result-meta em { margin-left: 8px; color: #777; font-style: normal; }
#featured-image {
  width:min(55%,420px);
  height:auto;
  max-height:420px;
  aspect-ratio:1;
  object-fit:contain;
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-54%);
  image-rendering:pixelated;
  transition:opacity .25s ease;
}
.hero-art { min-height:640px; display:grid; place-items:center; }
@media(max-width:1000px){#featured-image{width:min(58vw,400px);max-height:400px}.hero-art{min-height:540px}}
@media(max-width:680px){#featured-image{width:min(70vw,320px);max-height:320px}.hero-art{min-height:400px}}
.wordmark { color: #f1efe8; text-decoration: none; font: 600 13px var(--display); letter-spacing: .18em; }
#new-anime-label input { border: 1px solid #3d3d3d; background: #181818; color: #fff; padding: 13px; font: 12px var(--mono); outline: none; }
#new-anime-label[hidden] { display: none !important; }
#new-anime-name { text-transform: uppercase; }
.category-card strong,.tag,.list-anime,#detail-anime,#detail-extra,#detail-traits { text-transform: uppercase; }
.art-card { animation: none !important; }
.list-head { display: grid; grid-template-columns: 48px minmax(190px, 1.2fr) 1.1fr .7fr .7fr .55fr; gap: 16px; padding: 10px 14px; border: 1px solid #303030; color: #777; font: 8px var(--mono); text-transform: uppercase; }
.list-head span:first-child { grid-column: 1 / 3; }
.list-head[hidden] { display: none; }
.list-only { display: none; }
.art-grid.list-view { display: block; }
.art-grid.list-view .art-card { display: grid; grid-template-columns: 48px minmax(190px, 1.2fr) 1.1fr .7fr .7fr .55fr; gap: 16px; align-items: center; padding: 9px 14px; border: 1px solid #292929; border-top: 0; }
.art-grid.list-view .art-image { width: 48px; height: 48px; aspect-ratio: 1; overflow: visible; }
.art-grid.list-view .art-image img { border-radius: 3px; }
.art-grid.list-view .art-info { display: none; }
.art-grid.list-view .art-card { position: relative; min-height: 68px; }
.art-grid.list-view .art-image .status,.art-grid.list-view .save-fab,.art-grid.list-view .classify-fab { display: none; }
.art-grid.list-view .list-only { display: block; }
.list-item { border: 0; padding: 0; background: transparent; color: #eee; text-align: left; font: 12px var(--mono); cursor: pointer; }
.list-anime,.list-state,.list-link { color: #aaa; font: 9px var(--mono); text-transform: uppercase; }
.list-price { color: var(--lime); font: 11px var(--mono); }.list-state.verified{color:var(--lime)}.list-state.review{color:#ffd54b}.list-link{color:#ff8588;text-decoration:none}
@media (max-width: 900px) {.list-head{display:none!important}.art-grid.list-view .art-card{grid-template-columns:58px 1fr 1fr}.art-grid.list-view .art-image{grid-row:1/3}.art-grid.list-view .list-item{grid-column:2/4}.art-grid.list-view .list-anime{grid-column:2/4}.art-grid.list-view .list-price,.art-grid.list-view .list-vote,.art-grid.list-view .list-state,.art-grid.list-view .list-link{grid-column:auto}}

.detail-dialog {
  width: min(1040px, calc(100% - 32px));
  max-width: none;
  max-height: 92vh;
}

.detail-layout { display: grid; grid-template-columns: 1.05fr .95fr; position: relative; }
.detail-media { min-height: 570px; background: #1a1a1a; }
.detail-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.detail-copy { display: flex; flex-direction: column; padding: 46px; }
.detail-copy h2 { margin: 12px 0 24px; font-size: 52px; }
.detail-score { display: flex; align-items: center; gap: 13px; padding-bottom: 24px; border-bottom: 1px solid #333; }
.detail-score strong { color: var(--lime); font: 42px var(--mono); }
.detail-score span { color: #777; font: 8px/1.4 var(--mono); text-transform: uppercase; }
.detail-facts { display: grid; grid-template-columns: 1fr 1fr; }
.detail-facts div { padding: 18px 0; border-bottom: 1px solid #2e2e2e; }
.detail-facts span, .detail-facts strong { display: block; }
.detail-facts span { margin-bottom: 7px; color: #666; font: 8px var(--mono); text-transform: uppercase; }
.detail-facts strong { font-size: 13px; }
.detail-disclaimer { color: #777; font-size: 11px; line-height: 1.5; }
.detail-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }
.opensea-link { margin-top: 20px; color: #aaa; font: 9px var(--mono); text-transform: uppercase; }

@media (max-width: 1000px) {
  .toolbar { grid-template-columns: 1fr; }
  .sort-control { min-height: 42px; }
}

@media (max-width: 760px) {
  .detail-layout { grid-template-columns: 1fr; }
  .detail-media { min-height: 320px; max-height: 42vh; }
  .detail-copy { padding: 28px; }
  .detail-copy h2 { font-size: 38px; }
  .detail-actions { margin-top: 22px; }
  .save-fab { opacity: 1; transform: none; }
}