:root:has(.tf){--sl-content-width:62rem}.tf{--r-lg:.75rem;--r:.5rem;--r-sm:.375rem;--r-xs:.25rem;--fs-md:.875rem;--fs-sm:.75rem;--fs-xs:.6875rem;--line:color-mix(in srgb, var(--sl-color-gray-5) 65%, transparent);--line-soft:color-mix(in srgb, var(--sl-color-gray-5) 35%, transparent);--surface:color-mix(in srgb, var(--sl-color-gray-6) 45%, transparent);--surface-hi:color-mix(in srgb, var(--sl-color-gray-6) 80%, transparent);--well:var(--sl-color-black);--g-common:var(--sl-color-white);--g-rare:#4fbb70;--g-legend:#4f9fe6;--g-gold:#dcae38;--g-mythic:#ff6a1f;--f-elyos:#c9a24a;--f-asmodian:#b06a8a;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--well);color:var(--sl-color-gray-2);font-size:var(--fs-md);margin-block:1.75rem;padding:1.5rem;box-shadow:0 12px 32px -12px #00000073}[data-theme=light] .tf{--g-rare:#1f8a45;--g-legend:#1f6fbf;--g-gold:#96700f;--g-mythic:#c2410c;--f-elyos:#8a6b12;--f-asmodian:#8c3f63}.tf *,.tf :before,.tf :after{box-sizing:border-box}.tf .tf-icon{inset-inline-start:.875rem;fill:none;width:1.125rem;height:1.125rem;stroke:var(--sl-color-gray-3);stroke-width:2px;stroke-linecap:round;pointer-events:none;transition:stroke .15s;position:absolute;top:50%;translate:0 -50%}.tf .tf-icon-sm{width:1rem;height:1rem;inset-inline-start:.75rem}.tf .tf-search{margin-bottom:.875rem;position:relative}.tf .tf-q{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);width:100%;color:var(--sl-color-white);font:inherit;padding:.625rem 1rem .625rem 2.75rem;line-height:1.5;transition:border-color .15s,box-shadow .15s}.tf .tf-q::placeholder{color:var(--sl-color-gray-3)}.tf .tf-q:focus{border-color:var(--sl-color-accent);box-shadow:0 0 0 1px var(--sl-color-accent);outline:none}.tf .tf-search:focus-within .tf-icon{stroke:var(--sl-color-accent)}.tf .tf-controls{border:1px solid var(--line-soft);border-radius:var(--r);background:var(--surface);flex-direction:column;gap:1.25rem;margin-bottom:1.5rem;padding:1.25rem;display:flex}.tf .tf-field{grid-template-columns:6.25rem 1fr;align-items:center;gap:1rem;display:grid}.tf .tf-field-top{align-items:start}.tf .tf-label{font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.05em;color:var(--sl-color-gray-3);font-weight:600;display:block}.tf .tf-field-top .tf-label{padding-top:.5rem}.tf .tf-hint{font-size:var(--fs-xs);color:var(--sl-color-gray-4,var(--sl-color-gray-3));margin-top:.125rem;line-height:1.35;display:block}.tf .tf-segmented{border:1px solid var(--line);border-radius:var(--r);background:var(--well);gap:.125rem;width:fit-content;padding:.25rem;display:inline-flex}.tf .tf-seg{border-radius:calc(var(--r) - .125rem);color:var(--sl-color-gray-3);font:inherit;font-size:var(--fs-sm);cursor:pointer;background:0 0;border:0;margin:0;padding:.375rem 1rem;font-weight:500;line-height:1.25;transition:background-color .15s,color .15s}.tf .tf-seg:hover:not(.is-active){color:var(--sl-color-white)}.tf .tf-seg.is-active{background:var(--sl-color-accent);color:#fff;font-weight:600;box-shadow:0 1px 2px #00000040}.tf .tf-seg:focus-visible{outline:2px solid var(--sl-color-accent);outline-offset:2px}.tf .tf-panel{border:1px solid var(--line);border-radius:var(--r);background:var(--well);flex-direction:column;gap:.75rem;padding:.75rem;display:flex}.tf .tf-panel-search{align-items:center;gap:.5rem;display:flex;position:relative}.tf .tf-panel-filter{border:1px solid var(--line-soft);border-radius:var(--r-sm);background:var(--surface);min-width:0;color:var(--sl-color-white);font:inherit;font-size:var(--fs-sm);flex:1;padding:.375rem .75rem .375rem 2.25rem;line-height:1.5}.tf .tf-panel-filter::placeholder{color:var(--sl-color-gray-3)}.tf .tf-panel-filter:focus{border-color:var(--sl-color-accent);outline:none}.tf .tf-panel-search:focus-within .tf-icon{stroke:var(--sl-color-accent)}.tf .tf-deselect{border:1px solid var(--line);border-radius:var(--r-sm);color:var(--sl-color-gray-3);font:inherit;font-size:var(--fs-xs);cursor:pointer;background:0 0;flex:none;padding:.3125rem .625rem;transition:color .15s,border-color .15s}.tf .tf-deselect:hover{color:var(--sl-color-white);border-color:var(--sl-color-accent)}.tf .tf-panel-list{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--sl-color-gray-5) transparent;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1.5rem;align-content:start;align-items:stretch;gap:.625rem;height:12rem;padding-inline-end:.25rem;display:grid;overflow-y:auto}@media (width<=60rem){.tf .tf-panel-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=40rem){.tf .tf-panel-list{grid-template-columns:minmax(0,1fr)}}.tf .tf-check{min-width:0;height:1.5rem;font-size:var(--fs-sm);color:var(--sl-color-gray-2);cursor:pointer;user-select:none;align-items:center;gap:.5rem;line-height:1.5rem;transition:color .12s;display:flex}.tf .tf-check:hover{color:var(--sl-color-white)}.tf .tf-check.is-on{color:var(--sl-color-white);font-weight:600}.tf .tf-check input{appearance:none;border:1px solid var(--sl-color-gray-4);border-radius:var(--r-xs);background:var(--surface);cursor:pointer;flex:none;align-self:center;width:.875rem;height:.875rem;margin:0;transition:background-color .12s,border-color .12s}.tf .tf-check:hover input{border-color:var(--sl-color-gray-3)}.tf .tf-check input:checked{border-color:var(--sl-color-accent);background:var(--sl-color-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l3 3 6-6'/%3E%3C/svg%3E") center / .6875rem no-repeat}.tf .tf-check input:focus-visible{outline:2px solid var(--sl-color-accent);outline-offset:2px}.tf .tf-check .lbl{text-overflow:ellipsis;white-space:nowrap;min-width:0;line-height:inherit;overflow:hidden}.tf .tf-check .n{color:var(--sl-color-gray-3);font-variant-numeric:tabular-nums;line-height:inherit;white-space:nowrap;flex:none}.tf .tf-check.is-on .n{color:inherit;opacity:.75}.tf .tf-panel-foot{min-height:1.5rem;font-size:var(--fs-xs);color:var(--sl-color-gray-3);border-top:1px solid #0000;margin:0;padding-top:.5rem;transition:border-color .15s}.tf .tf-panel-foot.has-content{border-top-color:var(--line-soft)}.tf .tf-panel-list.is-empty{grid-template-columns:minmax(0,1fr);grid-auto-rows:auto}.tf .tf-panel-empty{height:auto;min-height:1.5rem;font-size:var(--fs-sm);color:var(--sl-color-gray-3);grid-column:1/-1;padding:.75rem 0}.tf .tf-best{border:1px solid var(--line-soft);border-radius:var(--r);background:var(--surface);margin-bottom:1.5rem;padding:1rem 1.25rem 1.125rem}.tf .tf-best-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.875rem;display:flex}.tf .tf-best-title{font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.05em;color:var(--sl-color-gray-3);margin:0;font-weight:600}.tf .tf-best-rank{font-size:var(--fs-xs);color:var(--sl-color-gray-3);align-items:center;gap:.5rem;display:flex}.tf .tf-rank{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--well);max-width:14rem;color:var(--sl-color-white);font:inherit;font-size:var(--fs-xs);padding:.25rem .5rem}.tf .tf-best-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;display:grid}.tf .tf-card{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--well);flex-direction:column;gap:.375rem;min-height:6.25rem;padding:.75rem .875rem;display:flex}.tf .tf-card-slot{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--sl-color-gray-3);font-weight:600}.tf .tf-card-name{font-size:var(--fs-sm);font-weight:600;line-height:1.35}.tf .tf-card.g-11 .tf-card-name{color:var(--g-common)}.tf .tf-card.g-21 .tf-card-name{color:var(--g-rare)}.tf .tf-card.g-31 .tf-card-name{color:var(--g-legend)}.tf .tf-card.g-41 .tf-card-name,.tf .tf-card.g-71 .tf-card-name{color:var(--g-gold)}.tf .tf-card.g-51 .tf-card-name{color:var(--g-mythic)}.tf .tf-card-value{font-variant-numeric:tabular-nums;color:var(--sl-color-white);margin-top:auto;font-size:1.125rem;font-weight:700}.tf .tf-card-meta{font-size:var(--fs-xs);color:var(--sl-color-gray-3)}.tf .tf-card.is-empty .tf-card-value{color:var(--sl-color-gray-4,var(--sl-color-gray-3))}.tf .tf-best-note{font-size:var(--fs-xs);color:var(--sl-color-gray-3);margin:.875rem 0 0;line-height:1.5}@media (width<=45rem){.tf .tf-best-cards{grid-template-columns:minmax(0,1fr)}}.tf .tf-status{min-height:1.75rem;font-size:var(--fs-sm);color:var(--sl-color-gray-3);justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.75rem;padding-inline:.25rem;display:flex}.tf .is-invisible{visibility:hidden;pointer-events:none}.tf .tf-count strong{color:var(--sl-color-white);font-weight:600}.tf .tf-clear{border:1px solid var(--line);border-radius:var(--r-sm);color:var(--sl-color-gray-3);font:inherit;font-size:var(--fs-xs);cursor:pointer;background:0 0;padding:.25rem .625rem;transition:color .15s,border-color .15s}.tf .tf-clear:hover{color:var(--sl-color-white);border-color:var(--sl-color-accent)}.tf .tf-table-wrap{border:1px solid var(--line);border-radius:var(--r);overflow:hidden}.tf .tf-table{border-collapse:collapse;table-layout:fixed;width:100%;font-size:var(--fs-sm);margin:0}.tf .tf-table thead tr{background:var(--surface-hi)}.tf .tf-table th{text-align:start;vertical-align:middle;border-bottom:1px solid var(--line);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--sl-color-gray-3);padding:.75rem 1rem;font-weight:600}.tf .tf-table td{text-align:start;vertical-align:top;border-bottom:1px solid var(--line-soft);padding:.875rem 1rem}.tf .tf-table tbody tr:last-child td{border-bottom:0}.tf .tf-table tbody tr{transition:background-color .12s}.tf .tf-table tbody tr:hover{background:var(--surface)}.tf [hidden]{display:none!important}.tf .c-name{width:24%}.tf .c-grade{width:6.5rem}.tf .c-stats{width:28%}.tf .c-from{width:auto}.tf .tf-name{font-weight:600;line-height:1.4}.tf tr.g-11 .tf-name{color:var(--g-common)}.tf tr.g-21 .tf-name{color:var(--g-rare)}.tf tr.g-31 .tf-name{color:var(--g-legend)}.tf tr.g-41 .tf-name,.tf tr.g-71 .tf-name{color:var(--g-gold)}.tf tr.g-51 .tf-name{color:var(--g-mythic)}.tf .tf-factions{flex-wrap:wrap;gap:.25rem;margin-top:.375rem;display:flex}.tf .tf-faction{border:1px solid color-mix(in srgb, currentcolor 30%, transparent);border-radius:var(--r-xs);background:color-mix(in srgb, currentcolor 10%, transparent);font-size:var(--fs-xs);color:var(--sl-color-gray-3);padding:.0625rem .375rem;font-weight:500}.tf .tf-faction.f-elyos{color:var(--f-elyos)}.tf .tf-faction.f-asmodian{color:var(--f-asmodian)}.tf .tf-grade{border:1px solid color-mix(in srgb, currentcolor 35%, transparent);border-radius:var(--r-xs);background:color-mix(in srgb, currentcolor 12%, transparent);font-size:var(--fs-xs);white-space:nowrap;align-items:center;padding:.125rem .5rem;font-weight:500;display:inline-flex}.tf .tf-grade.g-11{color:var(--g-common)}.tf .tf-grade.g-21{color:var(--g-rare)}.tf .tf-grade.g-31{color:var(--g-legend)}.tf .tf-grade.g-41,.tf .tf-grade.g-71{color:var(--g-gold)}.tf .tf-grade.g-51{color:var(--g-mythic)}.tf .tf-statlist{margin:0;padding:0;list-style:none}.tf .tf-statlist li{color:var(--sl-color-gray-3);align-items:baseline;gap:.375rem;margin:0 0 .3125rem;line-height:1.45;display:flex}.tf .tf-statlist li:last-child{margin-bottom:0}.tf .tf-statlist li.starts-collection{border-top:1px dashed var(--line-soft);margin-top:.4375rem;padding-top:.4375rem}.tf .tf-statlist li:before{content:"";background:var(--sl-color-gray-4,var(--sl-color-gray-3));border-radius:50%;flex:none;align-self:center;width:.25rem;height:.25rem}.tf .tf-statlist .v{color:var(--sl-color-white);font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600}.tf .tf-tag{border-radius:var(--r-xs);background:var(--surface-hi);font-size:var(--fs-xs);color:var(--sl-color-gray-3);white-space:nowrap;padding:.0625rem .3125rem}.tf .tf-none{color:var(--sl-color-gray-3)}.tf .tf-cat{text-transform:capitalize;color:var(--sl-color-gray-2);margin-bottom:.125rem;font-weight:600;display:block}.tf .tf-desc{color:var(--sl-color-gray-3);white-space:pre-line;margin:0;line-height:1.6}.tf .tf-empty{text-align:center;font-size:var(--fs-sm);color:var(--sl-color-gray-3);flex-direction:column;gap:.25rem;padding:3rem 1rem;display:flex}.tf .tf-empty strong{color:var(--sl-color-white);font-weight:600}.tf .tf-more-wrap{justify-content:center;display:flex}.tf .tf-more{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);color:var(--sl-color-white);font:inherit;font-size:var(--fs-sm);cursor:pointer;margin-top:1rem;padding:.5rem 1.25rem;transition:border-color .15s,background-color .15s}.tf .tf-more:hover{border-color:var(--sl-color-accent);background:var(--surface-hi)}@media (width<=55rem){.tf{padding:1rem}.tf .tf-field{grid-template-columns:minmax(0,1fr);gap:.5rem}.tf .tf-field-top .tf-label{padding-top:0}.tf .tf-segmented{width:100%}.tf .tf-seg{text-align:center;flex:1;padding-inline:.5rem}.tf .tf-table-wrap{overflow-x:auto}.tf .tf-table{min-width:44rem}}@media (prefers-reduced-motion:reduce){.tf *{transition:none!important}}
