.app-shell #build .toolbar #type { display:none; }
.app-shell #build .toolbar #search { min-width:0; flex:1; }
.app-shell #build #deck-filters-toggle { flex:none; color:#e4c477; border:1px solid #655537; background:#20211f; padding:10px 16px; }
.app-shell #build #deck-card-filters { padding:14px; margin:0 0 14px; border:1px solid #393b36; border-radius:7px; background:linear-gradient(120deg,#20221f,#191d1c); color:#e0e2da; }
.app-shell #build #deck-card-filters[hidden] { display:none; }
.deck-filter-fields { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.app-shell #build .deck-filter-menu { position:relative; margin:0; padding:0; min-width:0; border:1px solid #393d35; border-radius:3px; background:#232620; }
.app-shell #build .deck-filter-menu summary { padding:11px 12px; font-size:12px; line-height:1.4; cursor:pointer; overflow-wrap:anywhere; color:#d6d9ce; }
.app-shell #build .deck-filter-menu[open] { border-color:#c9a552; }
.deck-filter-options { position:absolute; top:calc(100% + 5px); left:0; z-index:30; min-width:100%; width:max-content; max-width:min(300px,80vw); max-height:280px; overflow:auto; padding:8px; box-sizing:border-box; background:#222620; border:1px solid #55553f; border-radius:4px; box-shadow:0 12px 28px #0009; }
.app-shell #build .deck-filter-options label { display:flex; align-items:center; gap:9px; padding:9px 7px; margin:0; font-size:12px; cursor:pointer; }
.deck-filter-options label:hover { background:#34382b; }
.app-shell #build .deck-filter-options input { width:14px; height:14px; margin:0; accent-color:#dbb65c; }
.deck-filters-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; border-top:1px solid #34382f; margin-top:14px; padding-top:10px; }
.deck-filters-active { display:flex; flex-wrap:wrap; gap:6px; font-size:11px; color:#9ea599; }
.app-shell #build .deck-filters-active button { padding:4px 7px; border:1px solid #535840; border-radius:4px; background:#2b3026; color:#e3d7b4; font-size:11px; }
.app-shell #build .deck-filters-clear { flex:none; padding:7px; background:transparent; border:0; color:#d6bd7a; font-size:12px; }
.rarity-gem { width:10px; height:10px; flex:none; transform:rotate(45deg); background:#ccdbe0; border:1px solid #ffffff66; box-shadow:inset 3px 0 #ffffff44; }
.rarity-common { border-radius:50%; }
.rarity-uncommon { background:#67b9a4; clip-path:polygon(0 0,100% 100%,0 100%); }
.rarity-rare { background:#dc7abb; }
.rarity-epic { background:#e9a544; }
.rarity-showcase { background:#e4cf48; }
@media(max-width:600px) { .deck-filter-fields { grid-template-columns:1fr; } .deck-filter-options { position:static; width:100%; max-width:none; box-shadow:none; border:0; border-top:1px solid #454936; } }

.app-shell #build .library-sort { display:flex; align-items:center; gap:8px; flex:none; margin:0; color:#e4c477; font-size:13px; }
.app-shell #build .library-sort select { padding:9px 10px; border:1px solid #655537; border-radius:7px; background:#20211f; color:#f0e2c4; font-size:14px; }
@media(max-width:760px) { .deck-filter-fields { grid-template-columns:repeat(2,minmax(0,1fr)); } .app-shell #build div.toolbar { flex-wrap:wrap; } .app-shell #build .library-sort { flex:1 1 100%; } .app-shell #build .toolbar select#library-sort { flex:1; width:auto; max-width:none; } }
