.search-pager{margin-top: 12px;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;gap: 8px;padding: 10px 12px;border: 1px solid rgba(84,120,156,0.35);border-radius: 999px;background: linear-gradient(180deg,rgba(20,31,46,0.86),rgba(15,24,36,0.92));box-shadow: 0 14px 24px rgba(4,9,16,0.32),inset 0 1px 0 rgba(255,255,255,0.07);backdrop-filter: blur(8px);width: max-content;max-width: 100%;margin-inline: auto} .search-pager button:hover:not(:disabled):not(.active){transform: translateY(-1px);border-color: rgba(136,184,229,0.8);background: linear-gradient(180deg,rgba(48,75,107,0.92),rgba(35,57,82,0.94));box-shadow: 0 10px 18px rgba(6,12,20,0.36)} .search-pager button.active{background: linear-gradient(180deg,#6ee4ff,#44c8f0);border-color: #a4f0ff;color: #0b1a26;box-shadow: 0 10px 22px rgba(31,146,188,0.38),0 0 0 1px rgba(138,239,255,0.58)} .search-pager button:first-child,.search-pager button:last-child{padding: 0 14px;font-weight: 700;color: #cde4ff;background: linear-gradient(180deg,rgba(40,63,90,0.88),rgba(29,48,68,0.92))} .cards-list{display: grid;grid-template-columns: repeat(auto-fill,minmax(240px,1fr));gap: 18px;justify-items: center} .cards-main{display: grid;grid-template-columns: minmax(0,1fr);gap: 0;min-width: 0} .cards-main>*{min-width: 0} .cards-results-shell{position: relative;z-index: 1;padding: 16px 0 0;background: transparent;box-shadow: none} .cards-page .cards-list .card-item:nth-child(2n){animation-delay: 40ms} .cards-page .cards-list .card-item:nth-child(3n){animation-delay: 80ms} .cards-filter-shell{background: transparent} .cards-filter-top{width: 100%} .cards-filter-top input[type="search"]{width: 100%} .cards-top-actions{display: flex;gap: 12px;align-items: center} .cards-top-actions>*{min-width: 0} .cards-sort-control,.cards-filter-actions{display: flex;align-items: center;gap: 8px} .cards-sort-control label{color: var(--color-muted);font-size: 0.82rem;white-space: nowrap} .cards-sort-control select{min-width: 100px} .cards-filter-actions{margin: 0;padding: 0} .cards-page .cards-filter-shell .cards-filter-actions #cards-filter-clear{background: transparent;border-color: transparent;color: var(--color-muted)} .cards-page .cards-filter-shell .cards-filter-actions #cards-filter-clear:hover{border-color: var(--color-interactive);color: var(--ink)} .cards-page .cards-filter-shell :is(#cards-search-input,#cards-sort-key,.cards-icon-btn,.cards-multi-toggle){background: var(--color-surface);border: 1px solid var(--color-line);color: var(--ink);border-radius: var(--radius-control);box-shadow: none;transition: border-color 0.16s ease,background 0.16s ease} .cards-page .cards-filter-shell :is(#cards-search-input,#cards-sort-key,.cards-icon-btn,.cards-multi-toggle):hover{border-color: var(--color-interactive);background: #18232c} .cards-icon-btn{min-width: 60px;color: var(--ink)} .cards-page .cards-filter-shell :is(#cards-sort-dir,#cards-filter-clear,#cards-filter-toggle,.cards-multi-toggle){border-color: #4d657e;border-radius: 10px;background: #223247} .cards-filter-body{margin-top: 12px} .cards-page .cards-active-filters[hidden]{display: none} .cards-page .cards-chip{min-height: 44px} .cards-filter-group[hidden]{display: none} .cards-filter-group-label{margin: 0 0 var(--space-3);color: var(--color-muted);font-size: 0.75rem;font-weight: 700;letter-spacing: 0.1em;text-transform: uppercase} .cards-advanced-filters{margin-top: var(--space-4);padding-top: var(--space-4);border-top: 1px solid var(--color-line)} .cards-domain-icons{display: flex;gap: 6px;flex-wrap: nowrap} .cards-filter-row{display: flex;flex-wrap: wrap;align-items: center;gap: 12px 16px} .cards-filter-row>#cards-filter-toggle{margin-left: auto;white-space: nowrap} .cards-domain-btn{width: 44px;height: 44px;border-radius: 999px;border: 1px solid #3a475a;background: linear-gradient(180deg,#1b232f,#131c28);display: grid;place-items: center;padding: 0;overflow: hidden;flex: 0 0 auto;transition: background 0.16s ease,border-color 0.16s ease,box-shadow 0.16s ease} .cards-domain-btn:hover:not(:disabled){border-color: #9fbbd1;background: #2a3b4d} .cards-domain-btn img{width: 26px;height: 26px;object-fit: contain;display: block} .cards-domain-btn.active{border: 2px solid #eac56b;background: #51452b;box-shadow: inset 0 0 0 2px #19232e,0 0 0 1px rgba(234,197,107,0.4)} .cards-domain-btn.active:hover:not(:disabled){border-color: #ffe3a1;background: #655435} .cards-domain-btn:disabled{opacity: 0.4} .cards-select-grid{display: grid;grid-template-columns: repeat(6,minmax(130px,1fr));gap: 10px} .cards-select-grid-primary{grid-template-columns: repeat(2,max-content);gap: 12px} .cards-select-grid-primary .cards-select-field{display: flex;align-items: center;gap: 8px} .cards-select-grid-primary .cards-multi{width: 148px} .cards-multi-toggle{display: flex;align-items: center;justify-content: space-between;gap: 8px;width: 100%;min-width: 0;text-align: left} .cards-multi-toggle>span{min-width: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap} .cards-multi-toggle::after{content:"";width: 6px;height: 6px;border-right: 1.5px solid currentColor;border-bottom: 1.5px solid currentColor;transform: rotate(45deg) translateY(-2px);flex-shrink: 0} @media (min-width: 681px){.cards-select-grid-primary .cards-multi-menu{min-width: 220px}} .cards-select-grid-advanced{grid-template-columns: repeat(4,minmax(140px,1fr))} .cards-select-field{display: grid;gap: 6px;min-width: 0} .cards-select-field span{color: var(--subtle);font-size: 0.82rem} .cards-multi{position: relative;min-width: 0;z-index: 3} .cards-multi.is-open{z-index: 180} .cards-filter-backdrop{position: fixed;inset: 0;z-index: 155;display: none;padding: 0;border: 0;border-radius: 0;background: rgba(5,10,18,0.58);backdrop-filter: blur(3px)} .cards-multi-toggle[aria-expanded="true"]{border-color: #6db8df;box-shadow: 0 0 0 2px rgba(109,184,223,0.18),0 10px 28px rgba(8,14,22,0.55)} .cards-multi-menu{position: absolute;left: 0;right: 0;top: calc(100% + 8px);z-index: 140;border: 1px solid #3f5166;border-radius: 12px;background: #18212f;max-height: 280px;overflow: auto;overscroll-behavior: contain;padding: 8px;box-shadow: 0 18px 36px rgba(5,10,18,0.62),inset 0 1px 0 rgba(255,255,255,0.05);backdrop-filter: blur(2px)} .cards-multi-menu[hidden]{display: none} .cards-multi-item{display: flex;align-items: center;gap: 10px;padding: 9px 10px;min-height: 40px;border-radius: 10px;cursor: pointer;color: #dce6f3;border: 1px solid transparent;transition: background-color 0.14s ease,border-color 0.14s ease,transform 0.14s ease} .cards-multi-menu button.cards-multi-item{width: 100%;justify-content: flex-start;text-align: left;font: inherit;color: #dce6f3;background: transparent;border: 1px solid transparent;border-radius: 10px;box-shadow: none;padding: 9px 10px} .cards-multi-item:hover{background: rgba(68,90,116,0.28);border-color: rgba(112,147,183,0.42)} .cards-multi-item:has(input:checked){background: rgba(76,201,240,0.14);border-color: rgba(114,239,221,0.42)} .cards-multi-item.is-selected{background: rgba(76,201,240,0.14);border-color: rgba(114,239,221,0.42)} .cards-multi-item input:hover,.cards-multi-item:hover .cards-multi-mark{border-color: #79b3d8} .cards-multi-item input:focus-visible{outline: none;border-color: #7fd9ff;box-shadow: 0 0 0 2px rgba(76,201,240,0.25)} .cards-multi-item input:checked,.cards-multi-item.is-selected .cards-multi-mark{border-color: #7fd9ff;background: linear-gradient(180deg,#2f6f94,#225776);background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='white' d='M6.5 11.2 3.6 8.4l-1.1 1.1 4 3.9 7-7-1.1-1.1z'/%3E%3C/svg%3E");background-repeat: no-repeat;background-position: center;background-size: 12px 12px} .cards-results-utility{display: flex;align-items: center;justify-content: space-between;gap: 12px 16px;margin-top: 16px;padding-top: 12px;border-top: 1px solid var(--color-line);flex-wrap: wrap} .cards-results-utility #cards-meta{margin: 0} .cards-results-utility #cards-meta strong{color: var(--ink)} .cards-page .cards-meta-source{margin: 16px 0 0;font-size: 0.75rem;text-align: center;overflow-wrap: anywhere} .cards-slider-head{display: flex;justify-content: space-between;gap: 8px;align-items: baseline;margin-bottom: 8px} .cards-slider-head strong{text-transform: uppercase;font-size: 0.95rem;letter-spacing: 0.02em} .cards-range-wrap{position: relative;height: 26px;--min-pct: 0%;--max-pct: 100%} .cards-range-wrap::before{content:"";position: absolute;left: 0;right: 0;top: 8px;height: 10px;border-radius: 999px;background: #202a38;border: 1px solid #304055} .cards-range-wrap::after{content:"";position: absolute;top: 8px;left: var(--min-pct);width: calc(var(--max-pct) - var(--min-pct));height: 10px;border-radius: 999px;background: linear-gradient(90deg,#ffbf3f 0%,#ff9f1a 100%)} .cards-range-wrap input[type="range"]{position: absolute;left: 0;right: 0;top: 0;width: 100%;margin: 0;pointer-events: none;background: transparent;border: 0;padding: 0;-webkit-appearance: none;appearance: none} .cards-range-wrap input[type="range"]::-webkit-slider-runnable-track{height: 26px;background: transparent} .cards-range-wrap input[type="range"]::-moz-range-track{height: 26px;background: transparent;border: 0} .cards-range-wrap input[type="range"]::-moz-range-progress{background: transparent} .cards-range-wrap input[type="range"]::-webkit-slider-thumb{pointer-events: auto;-webkit-appearance: none;width: 18px;height: 18px;margin-top: 4px;border-radius: 50%;border: 2px solid #f0b841;background: #101722;box-shadow: 0 0 0 1px #0b121d} .cards-range-wrap input[type="range"]::-moz-range-thumb{pointer-events: auto;width: 18px;height: 18px;border-radius: 50%;border: 2px solid #f0b841;background: #101722;box-shadow: 0 0 0 1px #0b121d} .cards-range-wrap input[type="range"].range-max::-webkit-slider-thumb{background: #f0b841;border-color: #ffe2a6} .cards-range-wrap input[type="range"].range-max::-moz-range-thumb{background: #f0b841;border-color: #ffe2a6} .cards-range-wrap input[type="range"]:focus-visible::-webkit-slider-thumb{box-shadow: 0 0 0 2px #0b121d,0 0 0 4px rgba(118,203,255,0.5)} .cards-range-wrap input[type="range"]:focus-visible::-moz-range-thumb{box-shadow: 0 0 0 2px #0b121d,0 0 0 4px rgba(118,203,255,0.5)} @media (max-width: 1220px){.cards-select-grid-advanced{grid-template-columns: repeat(3,minmax(130px,1fr))}} .card-item{display: block;width: 100%;max-width: 340px;cursor: pointer;padding: 3px;border: 1px solid transparent;border-radius: var(--radius-raised);background: transparent;box-shadow: none;transform: translateY(0);transition: transform 180ms ease,border-color 180ms ease,background 180ms ease} .card-item:hover{transform: translateY(-3px);border-color: #3f5166;background: rgba(31,45,58,0.42)} .card-item:focus-visible{outline: 2px solid #77dcff;outline-offset: 4px} .card-media{position: relative;border: 1px solid #36465a;border-radius: calc(var(--radius-raised) - 2px);overflow: hidden;background: radial-gradient(circle at 50% 30%,#152133,#0f1620 62%);aspect-ratio: 0.715;box-shadow: 0 8px 18px rgba(5,11,20,0.28)} .card-media img{width: 100%;height: 100%;object-fit: contain;display: block;transform: scale(1);transition: transform 220ms ease} .card-item:hover .card-media img{transform: scale(1.015)} .card-item.banned .card-media img{filter: grayscale(1) saturate(0.3) contrast(1.06)} .card-item.banned-2v2-only .card-media img{filter: none} .card-item.banned-2v2-only .card-banned-badge{background: #9a6422} .card-banned-badge{position: absolute;top: 0;left: 0;z-index: 2;display: inline-flex;align-items: center;justify-content: center;max-width: 100%;padding: 6px 9px;border-bottom-left-radius: 8px;border-bottom-right-radius: 8px;background: linear-gradient(180deg,#ff3d3d,#d51616);color: #ffffff;font-weight: 800;font-size: 0.74rem;line-height: 1.2;box-shadow: 0 10px 22px rgba(165,14,14,0.46)} .card-result-flags{position: absolute;left: 8px;right: 8px;bottom: 8px;z-index: 2;display: flex;flex-wrap: wrap;justify-content: center;gap: 5px;pointer-events: none} .card-result-flags span{border: 1px solid rgba(93,211,255,0.48);border-radius: 999px;padding: 3px 7px;background: rgba(8,20,32,0.78);color: #d9f4ff;font-size: 0.68rem;font-weight: 800;box-shadow: 0 8px 16px rgba(0,0,0,0.36)} .card-media-empty{height: 100%;display: flex;align-items: center;justify-content: center;color: var(--subtle);font-size: 0.88rem} .card-body h3{margin: 0 0 6px} .card-body p{margin: 0.35em 0} .cards-modal{position: fixed;inset: 0;z-index: 120} .cards-modal-full-page[hidden]{display: none !important} .cards-modal-backdrop{position: absolute;inset: 0;background: rgba(2,7,14,0.76)} .cards-modal-panel{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);width: min(1080px,92vw);max-height: 90vh;overflow: auto;border: 1px solid #33526e;border-radius: var(--radius-raised);background: #182433;box-shadow: 0 24px 60px #0009;padding: var(--space-4);padding-bottom: calc(var(--space-4) + env(safe-area-inset-bottom,0px));scrollbar-width: thin;scrollbar-color: #4f6782 #1a2431} .cards-modal-panel::-webkit-scrollbar{width: 11px} .cards-modal-panel::-webkit-scrollbar-track{background: linear-gradient(180deg,#1c2735,#18222f);border-left: 1px solid #2e3f53} .cards-modal-panel::-webkit-scrollbar-thumb{background: linear-gradient(180deg,#607a98,#4b647f);border: 2px solid #1b2633;border-radius: 999px} .cards-modal-panel::-webkit-scrollbar-thumb:hover{background: linear-gradient(180deg,#76a0cc,#5e85b0)} .cards-modal-media{border: 1px solid #38546e;border-radius: 12px;overflow: hidden;background: #0f1620;align-self: start;height: max-content} .cards-modal-media img{width: 100%;height: auto;aspect-ratio: 744 / 1039;object-fit: contain;display: block} .cards-modal-panel.is-landscape .cards-modal-media img{aspect-ratio: 1039 / 744;transform: none} .cards-modal-body h2{margin: 0 0 8px;font-size: clamp(1.6rem,1.2rem + 1vw,2rem);line-height: 1.2;letter-spacing: 0.01em} .cards-modal-header{display: flex;align-items: flex-start;justify-content: space-between;gap: var(--space-3);padding-bottom: var(--space-3);border-bottom: 1px solid var(--color-line)} .cards-modal-identity{min-width: 0} .cards-modal-utility-actions{position: sticky;top: 0;z-index: 3;display: flex;flex-wrap: wrap;align-items: center;justify-content: flex-end;gap: 8px;padding-bottom: 8px;background: #182433} .cards-modal-utility-actions .eyebrow{margin: 0 auto 0 0} .cards-modal-close{order: 2} .cards-modal-share-actions{display: flex;flex-wrap: wrap;justify-content: flex-end;gap: 8px;order: 1} .cards-modal-utility-actions button.secondary{min-height: 44px;padding: 7px 13px;border-radius: 999px;font-size: 0.84rem;font-weight: 700} .cards-modal-share-status{order: 3;flex-basis: 100%;color: var(--color-verified);font-size: 0.8rem;text-align: right} .cards-modal-share-status:empty{display: none} .cards-modal-body{display: grid;grid-template-columns: minmax(0,1fr);gap: 12px;align-content: start} .cards-modal-full-page{justify-self: start} .cards-modal-jump{display: flex;flex-wrap: wrap;gap: 6px} .cards-modal-jump a{display: inline-flex;align-items: center;min-height: 44px;padding: 6px 12px;border-radius: 8px;background: #1c3440;color: #a9e6d0;font-size: 0.875rem;font-weight: 700;text-decoration: none} .cards-modal-jump a:hover,.cards-modal-jump a:focus-visible{background: #294c59;color: #f1fff9} .cards-modal-body:has(#cards-modal-errata-wrap[hidden]) [href="#cards-modal-errata-wrap"],.cards-modal-body:has(#cards-modal-faq-wrap[hidden]) [href="#cards-modal-faq-wrap"],.cards-modal-body:has(#cards-modal-rules-wrap[hidden]) [href="#cards-modal-rules-wrap"],.cards-modal-body:not(:has(.cards-modal-related:not([hidden]))) .cards-modal-jump{display: none} .cards-modal .cards-modal-related{scroll-margin-top: 64px} .cards-modal .cards-modal-related:focus-visible{outline: 3px solid var(--ui-focus-ring);outline-offset: 4px} .cards-modal-text{color: #edf5ff;font-size: 1.18rem;font-weight: 560;line-height: 1.65;white-space: pre-wrap;max-width: 68ch} .cards-modal-errata-note{margin: 10px 0 0;border: 1px solid #7d493d;border-radius: 10px;padding: 8px 10px;background: rgba(112,47,35,0.22);color: #ffd4c8;font-size: 0.92rem;font-weight: 650;line-height: 1.4;white-space: normal} .cards-modal-text .rb-token{display: inline-flex;align-items: center;justify-content: center;vertical-align: middle;margin: 0 2px} .cards-modal-text .rb-energy{width: 1.18em;height: 1.18em;border-radius: 999px;background: #ffffff;color: #17212d;font-weight: 700;font-size: 0.9em;line-height: 1} .cards-modal-text .rb-rune{width: 1.08em;height: 1.08em;object-fit: contain} .cards-modal-text .rb-rainbow{width: 1.02em;height: 1.02em;border-radius: 999px;border: 1px solid #cfd9e4;background: conic-gradient(#e74c3c,#f1c40f,#2ecc71,#3498db,#9b59b6,#e74c3c)} .cards-modal-text .rb-rune-text{border-radius: 999px;border: 1px solid #3b546a;padding: 0.05em 0.4em;color: #b6cadf;font-size: 0.78em;text-transform: uppercase} .cards-modal-text .rb-exhaust{width: 1.08em;height: 1.08em;border-radius: 4px;border: 1px solid #5d738b;background: #1b2838;position: relative} .cards-modal-text .rb-exhaust::before{content:"";position: absolute;inset: 1px;background: #eaf3ff;-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.25 3a.75.75 0 0 1 .75.75v1.69A7.5 7.5 0 1 1 5.44 12H3.75a.75.75 0 0 1 0-1.5h3a.75.75 0 0 1 .75.75v3a.75.75 0 0 1-1.5 0v-1.41A6 6 0 1 0 12 6.94V8.5a.75.75 0 0 1-1.28.53L8.97 7.28a.75.75 0 0 1 0-1.06l1.75-1.75A.75.75 0 0 1 12 5v-.25a.75.75 0 0 1-.75-.75Z'/%3E%3C/svg%3E") center / contain no-repeat;mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.25 3a.75.75 0 0 1 .75.75v1.69A7.5 7.5 0 1 1 5.44 12H3.75a.75.75 0 0 1 0-1.5h3a.75.75 0 0 1 .75.75v3a.75.75 0 0 1-1.5 0v-1.41A6 6 0 1 0 12 6.94V8.5a.75.75 0 0 1-1.28.53L8.97 7.28a.75.75 0 0 1 0-1.06l1.75-1.75A.75.75 0 0 1 12 5v-.25a.75.75 0 0 1-.75-.75Z'/%3E%3C/svg%3E") center / contain no-repeat} body.modal-open{overflow: hidden} #cards-modal-rules-wrap .cards-related-item,#cards-modal-errata-wrap .cards-related-item{min-width: 0;overflow-wrap: anywhere} .cards-related-card-link{cursor: pointer} .cards-related-card-link:hover,.cards-related-card-link:focus-visible{border-color: #4b6c8d;background: #18283b} .cards-related-heading{display: block;margin: 0 0 8px;color: #e6f1ff;font-size: 0.95rem;line-height: 1.35} .cards-related-snippet{line-height: 1.55;color: #c9d8e8} .cards-related-foot{margin-top: 8px;display: flex;justify-content: space-between;align-items: center} .cards-collection-nav{display: flex;flex-wrap: wrap;justify-content: flex-end;align-items: center;gap: 8px} .cards-page>section{margin-top: 0} .cards-collection-link{display: inline-flex;align-items: center;justify-content: center;gap: 8px;min-height: 42px;padding: 8px 14px;border: 1px solid var(--color-line);border-radius: 12px;background: var(--color-surface);color: var(--color-text);font-size: 0.88rem;font-weight: 700;line-height: 1.25;text-align: center;text-decoration: none;transition: border-color 150ms ease,background-color 150ms ease,transform 150ms ease} .cards-collection-link:hover,.cards-collection-link:focus-visible{border-color: #8ad9f2;background: #253e51;transform: translateY(-1px)} .cards-collection-link.is-active{border-color: #6acbed;background: #254961;color: #f3fbff} .cards-collection-mark{color: #84d8ef;font-size: 1.1em;line-height: 1} .cards-collection-context{display: grid;gap: 8px;padding: 15px 18px;border: 1px solid #38546b;border-radius: var(--radius-raised);background: linear-gradient(135deg,#172b3a,#17232f)} .cards-collection-context[hidden],.cards-collection-context>[hidden]{display: none} .cards-collection-context .eyebrow{margin-bottom: 6px} .cards-collection-context p:not(.eyebrow){margin: 0;color: var(--color-muted);line-height: 1.55} .cards-collection-context #cards-banned-context>a{display: inline-block;margin-top: 7px;color: #9ee5fa} .cards-collection-context .cards-collection-nav{justify-content: flex-start;margin-top: 8px} .cards-page-hero + .cards-main{margin-top: 0} @media (max-width: 760px){.cards-modal-media img{max-height: 32svh;width: auto;max-width: 100%;margin-inline: auto}} .cards-modal-panel.is-landscape.has-rotated-source .cards-modal-media{width: 100%} .card-item.is-landscape .card-media{aspect-ratio: 1039 / 744} @media (max-width: 480px){.cards-page .card-item.is-landscape{grid-template-columns: 132px minmax(0,1fr);min-height: 0} .cards-page .card-item.is-landscape .card-media{width: 132px;aspect-ratio: 1039 / 744}} @media (max-width: 800px){.cards-page{overflow-x: clip} .search-pager{flex-wrap: nowrap;overflow-x: auto;contain: layout inline-size paint;scrollbar-width: thin;width: 100%;min-width: 0;box-sizing: border-box;border-radius: 14px;justify-content: flex-start} .cards-top-actions{width: 100%;justify-content: space-between} .cards-sort-control #cards-sort-key{min-width: 100px} .cards-top-actions .cards-icon-btn{width: auto;min-width: 60px} .cards-select-grid{grid-template-columns: 1fr 1fr} .cards-domain-icons{flex-wrap: wrap} .cards-filter-row{gap: 12px} .cards-select-grid-primary{grid-template-columns: repeat(2,minmax(0,1fr));width: 100%} .cards-select-grid-primary .cards-select-field{display: grid;gap: 4px} .cards-select-grid-primary .cards-multi{width: 100%;min-width: 0} .cards-filter-row>#cards-filter-toggle{width: 100%;margin: 0} .cards-range-wrap{height: 32px} .cards-range-wrap input[type="range"]::-webkit-slider-thumb{width: 20px;height: 20px} .cards-range-wrap input[type="range"]::-moz-range-thumb{width: 20px;height: 20px} .cards-list{grid-template-columns: repeat(auto-fit,minmax(210px,1fr));gap: 14px} .card-item{max-width: 300px;border-radius: 12px}} @media (max-width: 680px){.cards-filter-shell{padding: 0 0 var(--space-3)} .cards-select-grid{grid-template-columns: repeat(2,minmax(0,1fr));gap: 10px} .cards-select-field{min-width: 0} .cards-select-field span{overflow: hidden;text-overflow: ellipsis;white-space: nowrap} .cards-filter-backdrop:not([hidden]){display: block} body.cards-filter-menu-open{overflow: hidden} .cards-multi-menu{position: fixed;left: max(12px,env(safe-area-inset-left,0px));right: max(12px,env(safe-area-inset-right,0px));top: auto;bottom: max(12px,env(safe-area-inset-bottom,0px));max-height: min(64dvh,520px);z-index: 170;border-color: rgba(102,142,180,0.68);border-radius: 18px;padding: 50px 10px 12px;box-shadow: 0 26px 60px rgba(5,10,18,0.78),inset 0 1px 0 rgba(255,255,255,0.06);animation: cards-filter-sheet-in 160ms ease-out} .cards-multi-menu::before{content: attr(data-menu-title);position: absolute;top: 0;left: 0;right: 0;min-height: 42px;padding: 12px 14px 10px;border-bottom: 1px solid rgba(102,142,180,0.26);border-radius: 18px 18px 0 0;background: #223043;color: #eaf3fc;font-size: 0.92rem;font-weight: 800;letter-spacing: 0.02em} .cards-multi-item{min-height: 46px;padding: 12px 10px} @keyframes cards-filter-sheet-in{from{opacity: 0.72;transform: translateY(18px)} to{opacity: 1;transform: translateY(0)}}} @media (max-width: 680px){.card-item{border-radius: 10px;max-width: 240px} .cards-list{grid-template-columns: repeat(auto-fit,minmax(150px,1fr));gap: 12px} .cards-modal-panel{left: 0;top: 0;transform: none;width: 100vw;max-height: 100dvh;min-height: 100dvh;border-radius: 0;border-left: 0;border-right: 0;padding: 10px;padding-bottom: calc(18px + env(safe-area-inset-bottom,0px))} .cards-modal-grid{gap: 10px} .cards-modal-utility-actions .eyebrow,.cards-page-hero .eyebrow{display: none} .cards-modal-header{display: grid} .cards-modal-media{max-width: 72vw;margin: 0 auto} .cards-related-snippet{font-size: 0.95rem;line-height: 1.58} .cards-related-foot{gap: 8px;align-items: flex-end} .cards-page .cards-filter-shell{display: flex;flex-direction: column} .cards-page .cards-results-utility{display: flex;margin-top: 16px;padding-top: 12px;gap: 8px} .cards-page .cards-filter-body{margin-top: 12px} .cards-page-hero{gap: 10px;padding: 12px 14px} .cards-page-hero .muted{font-size: 0.9rem;line-height: 1.4} .cards-page-hero .cards-collection-nav{width: 100%;display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: 6px} .cards-page-hero .cards-collection-link{min-width: 0;min-height: 42px;padding: 7px 5px;font-size: 0.79rem} .cards-page .cards-filter-group-label{margin-bottom: 8px} .cards-page #cards-primary-filter-label{position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip-path: inset(50%);white-space: nowrap} .cards-page .cards-filter-row{gap: 12px} .cards-page .cards-domain-btn{width: 44px;height: 44px} .cards-page .cards-domain-icons{width: 100%;justify-content: space-between;flex-wrap: nowrap;gap: 0;padding: 0} .cards-page .cards-select-field{gap: 3px} .cards-page .cards-select-grid-primary{grid-template-columns: repeat(2,minmax(0,1fr));gap: 8px} .cards-page .cards-top-actions{flex-direction: row;align-items: center;gap: 8px} .cards-sort-control{display: grid;grid-template-columns: minmax(0,1fr) auto;gap: 6px} .cards-sort-control label{display: none} .cards-page .cards-sort-control #cards-sort-key{min-width: 0;width: 104px} .cards-page .cards-sort-control #cards-sort-dir{width: auto;min-width: 56px} .cards-page .cards-filter-actions{margin: 0;padding: 0;border: 0} .cards-page .cards-icon-btn,.cards-page #cards-sort-key{padding-inline: 8px;font-size: 0.82rem} .cards-page #cards-meta{width: 100%;font-size: 0.85rem} .cards-page .cards-results-shell{padding-top: 12px}} .cards-page .card-body{padding: 10px 5px 8px} .cards-page .card-body h3{margin: 0;color: var(--color-text);font-size: 0.95rem;line-height: 1.35;overflow-wrap: anywhere} .cards-page .card-body p{margin: 4px 0 0;color: var(--color-muted);font-size: 0.8rem} .card-result-flags-inline{display:none} @media (max-width:380px){.cards-page-hero .muted,.cards-page .cards-filter-group-label{display:none} .cards-page .cards-main{padding-inline: 8px}} @media (max-width:480px){.cards-page .cards-list{grid-template-columns:minmax(0,1fr)} .cards-page .card-item{display:grid;grid-template-columns:96px minmax(0,1fr);align-items:start;gap:12px;max-width:none;min-height:150px;padding:8px;border-color:var(--color-line);background:var(--color-surface)} .cards-page .card-media{width:96px;aspect-ratio:0.715} .cards-page .card-media .card-result-flags{display:none} .cards-page .card-body{min-width:0;padding:3px 0} .cards-page .card-body h3{font-size:1rem} .cards-page .card-body p{font-size:0.85rem} .cards-page .card-result-flags-inline{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px} .cards-page .card-result-flags-inline span{border:1px solid rgba(93,211,255,0.48);border-radius:999px;padding:3px 6px;color:#d9f4ff;font-size:0.72rem;line-height:1.3}} .cards-view-toggle{display: inline-flex;flex: none} .cards-page .cards-view-btn{display: inline-flex;align-items: center;justify-content: center;gap: 6px;padding: 0 12px;border: 1px solid #4d657e;border-radius: 0;background: var(--color-surface);color: var(--color-muted);font-size: 0.85rem;font-weight: 700} .cards-page .cards-view-btn:first-child{border-radius: var(--radius-control) 0 0 var(--radius-control)} .cards-page .cards-view-btn:last-child{border-left-width: 0;border-radius: 0 var(--radius-control) var(--radius-control) 0} .cards-page .cards-view-btn svg{width: 14px;height: 14px;fill: currentColor} .cards-page .cards-view-btn:hover{border-color: var(--color-interactive);color: var(--ink)} .cards-page .cards-view-btn[aria-pressed="true"]{background: #223247;color: var(--ink);box-shadow: inset 0 -3px 0 var(--color-interactive)} .cards-page .cards-list.is-list-view{display: block} .cards-table{width: 100%;border-collapse: collapse;table-layout: fixed;font-size: 0.9rem} .cards-table th,.cards-table td{padding: 10px 12px;border-bottom: 1px solid var(--color-line);color: var(--color-text);font-weight: 400;line-height: 1.4;text-align: left;vertical-align: top;overflow-wrap: anywhere} .cards-table thead th{color: var(--color-muted);font-size: 0.75rem;font-weight: 700;letter-spacing: 0.06em;text-transform: uppercase} .cards-table thead [data-col="card"]{width: 30%} .cards-table thead :is([data-col="type"],[data-col="domain"],[data-col="rarity"]){width: 11%} .cards-table thead :is([data-col="energy"],[data-col="might"],[data-col="power"]){width: 7%} .cards-table td:is([data-col="energy"],[data-col="might"],[data-col="power"]){font-variant-numeric: tabular-nums} .cards-row{position: relative} .cards-row:hover{background: rgba(93,211,255,0.06)} .cards-row-link{color: var(--color-text);font-weight: 700;text-decoration: none} .cards-row-link::after{content:"";position: absolute;inset: 0} .cards-row-link:focus-visible{outline: none} .cards-row-link:focus-visible::after{outline: 3px solid var(--ui-focus-ring);outline-offset: -3px} .cards-row-code{display: block;margin-top: 2px;color: var(--color-muted);font-size: 0.8rem} .cards-row-flags{display: flex;flex-wrap: wrap;gap: 4px;margin-top: 6px} .cards-row-flags span{border: 1px solid rgba(93,211,255,0.48);border-radius: 999px;padding: 2px 6px;color: #d9f4ff;font-size: 0.72rem;line-height: 1.3} @media (max-width: 800px){.cards-page .cards-results-utility{display: grid;grid-template-columns: minmax(0,1fr) auto;align-items: center;padding-top: 4px} .cards-page .cards-top-actions{display: contents} .cards-page .cards-results-utility #cards-meta{grid-column: 1;grid-row: 1;width: auto;min-width: 0} .cards-page .cards-view-toggle{grid-column: 2;grid-row: 1} .cards-page .cards-sort-control{grid-column: 1;grid-row: 2} .cards-page .cards-filter-actions{grid-column: 2;grid-row: 2} .cards-page .cards-view-btn{padding: 0 10px;font-size: 0.8rem}} @media (max-width: 374px){.cards-page .cards-view-btn{width: 44px;padding: 0} .cards-page .cards-view-btn span{position: absolute;width: 1px;height: 1px;overflow: hidden;clip-path: inset(50%);white-space: nowrap}} @media (max-width: 800px){.cards-table,.cards-table tbody{display: block} .cards-table thead{position: absolute;width: 1px;height: 1px;overflow: hidden;clip-path: inset(50%);white-space: nowrap} .cards-row{display: flex;flex-wrap: wrap;align-items: baseline;gap: 2px 12px;min-height: 44px;padding: 8px 4px;border-bottom: 1px solid var(--color-line)} .cards-table .cards-row>*{display: block;padding: 0;border: 0;font-size: 0.82rem} .cards-table .cards-row>th{flex: 1 1 100%;font-size: 0.95rem} .cards-table .cards-row>td:is([data-col="type"],[data-col="domain"],[data-col="rarity"],[data-col="set"]){order: 1;color: var(--color-muted)} .cards-table .cards-row>td:is([data-col="type"],[data-col="domain"],[data-col="rarity"])::after{content:"·";margin-left: 12px} .cards-row::after{content:"";order: 2;flex-basis: 100%} .cards-table .cards-row>td:is([data-col="energy"],[data-col="might"],[data-col="power"]){order: 3} .cards-table .cards-row>td:is([data-col="energy"],[data-col="might"],[data-col="power"])::before{content: attr(data-label);margin-right: 4px;color: var(--color-muted)}}