/* The market directory has its own compact card layout. */
.product .markets-page{padding-top:30px}
.product .markets-heading{align-items:center;margin-bottom:22px}
.product .markets-heading h1{font-size:30px;letter-spacing:-1px;margin:0}
.product .markets-page .market-search{height:52px;margin-bottom:17px;border-radius:13px}
.product .markets-page .market-categories{gap:8px;padding-bottom:14px}
.product .markets-page .category-chip{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:11px;font-size:12px;background:var(--surface);color:var(--text);border-color:transparent}
.product .markets-page .category-chip>svg{width:17px;height:17px;color:var(--topic,var(--accent))}
.product .markets-page .topic-all{--topic:#ba9efb}
.product .markets-page .topic-politics{--topic:#7bacfb}
.product .markets-page .topic-sports{--topic:#64c79f}
.product .markets-page .topic-crypto{--topic:#e6ae59}
.product .markets-page .topic-finance{--topic:#7bc8d6}
.product .markets-page .topic-technology{--topic:#b3a1f2}
.product .markets-page .topic-culture{--topic:#e993b4}
.product .markets-page .category-chip:hover{border-color:color-mix(in srgb,var(--topic) 50%,var(--line));background:color-mix(in srgb,var(--topic) 8%,var(--surface))}
.product .markets-page .category-chip.active{border-color:color-mix(in srgb,var(--topic) 62%,var(--line));background:color-mix(in srgb,var(--topic) 14%,var(--surface));color:var(--text)}
.product .markets-page .market-section-title{margin:16px 0 16px}
.product .markets-page .market-section-title h2{font-size:17px;letter-spacing:-.25px}
.product .markets-page .market-grid{gap:14px}
.product .markets-page .market-card{min-height:236px;border-radius:16px;padding:18px;transition:border-color .15s}
.product .markets-page .market-card:not(.skeleton-card):hover{transform:none;border-color:color-mix(in srgb,var(--accent) 55%,var(--line))}
.product .markets-page .market-card-top{align-items:flex-start;gap:12px;margin-bottom:19px}
.product .markets-page .market-avatar{position:relative;overflow:hidden;width:48px;height:48px;border-radius:12px}
.product .markets-page .market-avatar>svg{width:25px;height:25px;stroke-width:1.7}
.product .markets-page .market-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:3px;background:var(--surface-2)}
.product .markets-page .market-card h3{font-size:15px;font-weight:550;line-height:1.45;letter-spacing:-.1px;margin:1px 0 0;flex:1;min-width:0}
.product .markets-page .market-external{padding:2px;margin:2px -3px 0 0;opacity:.7}
.product .markets-page .market-external svg{height:15px;width:15px}
.product .markets-page .market-outcomes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;min-height:0;margin-top:auto;margin-bottom:17px}
.product .markets-page .outcome-row{background:var(--surface-2);padding:10px 11px;border-radius:9px;gap:8px;min-width:0;font-size:12px;color:var(--text)}
.product .markets-page .outcome-row strong{font-size:18px;font-weight:550;letter-spacing:-.4px;color:inherit;white-space:nowrap}
.product .markets-page .outcome-yes{color:#76d4ae;background:color-mix(in srgb,#48b386 12%,var(--surface))}
.product .markets-page .outcome-no{color:#efaaa9;background:color-mix(in srgb,#de7179 12%,var(--surface))}
.product .markets-page .outcome-neutral{color:#c5b3f2;background:color-mix(in srgb,var(--accent) 10%,var(--surface))}
.product .markets-page .outcome-row:nth-child(3){grid-column:1/-1}
.product .markets-page .more-outcomes{grid-column:1/-1;margin:0;font-size:10px}
.product .markets-page .market-card-bottom{padding-top:12px;gap:8px}
.product .markets-page .market-card-note{display:block;font-size:10px;max-width:none;min-width:0;line-height:1.4}
.product .markets-page .market-build-link{display:flex;align-items:center;gap:9px;flex-shrink:0;font-size:11px;font-weight:500;color:var(--accent);padding:5px 0 5px 6px}
.product .markets-page .market-build-link:hover{text-decoration:underline;text-underline-offset:3px}
.product .markets-page .market-disclaimer{margin-top:21px;font-size:10px}
.product .markets-page .skeleton-card{min-height:236px}
.product .markets-page .skeleton.avatar{margin-bottom:14px;width:48px;height:48px}
.product .markets-page .skeleton.title{height:14px}
.product .markets-page .skeleton.short{height:14px;margin-bottom:17px}
.product .markets-page .skeleton.row{height:16px;margin-bottom:8px}
.product .markets-page .skeleton.action{height:18px;margin-top:8px}
:root[data-theme="light"] .markets-page .outcome-yes{color:#237354}
:root[data-theme="light"] .markets-page .outcome-no{color:#a6424d}
:root[data-theme="light"] .markets-page .outcome-neutral{color:#6842ad}
:root[data-theme="light"] .markets-page .category-chip>svg{color:color-mix(in srgb,var(--topic) 68%,#282124)}
@media(min-width:1500px){.product .markets-page{padding-top:34px}}
@media(max-width:760px){.product .markets-page{padding-top:25px}.product .markets-heading{margin-bottom:18px}.product .markets-heading h1{font-size:27px}.product .markets-page .market-categories{margin-right:-22px;padding-right:22px}.product .markets-page .category-chip{font-size:11px;padding:8px 11px;gap:6px}.product .markets-page .market-card{padding:15px;min-height:237px}.product .markets-page .market-card-top{gap:9px}.product .markets-page .market-avatar{width:42px;height:42px;border-radius:10px}.product .markets-page .market-card h3{font-size:14px}.product .markets-page .market-card-bottom{justify-content:space-between}.product .markets-page .outcome-row{padding:9px 8px;font-size:11px}.product .markets-page .outcome-row strong{font-size:16px}}
@media(max-width:540px){.product .markets-page .market-grid{grid-template-columns:1fr}.product .markets-page .market-card{min-height:213px;padding:17px}.product .markets-page .market-card h3{font-size:15px}.product .markets-page .market-avatar{width:46px;height:46px}.product .markets-page .outcome-row{padding:10px 12px;font-size:12px}.product .markets-page .outcome-row strong{font-size:18px}.product .markets-page .market-card-note{font-size:10px}.product .markets-page .market-update>span{display:inline}}

.product .markets-page .market-image[src*="/soccer-leagues/"]{background:#f4f2ed;padding:4px}
