.referenceCatalog { width:100%; min-width:0; grid-column:1/-1; color:#e8ebf1; }
.referenceCatalog * { box-sizing:border-box; }
.referenceCatalogIntro { color:#a3acbb; font-size:11px; line-height:1.8; margin:0 0 22px; }
.referenceCatalogGrid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:20px; width:100%; }
.referencePoolCard { min-width:0; margin:0; }
.referencePoolCard{display:flex;flex-direction:column}
.referencePoolCard>button{height:auto;flex:1}
.quickDrawButtons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:10px;background:#252934;border:1px solid #ffffff0b;border-top:0;border-radius:0 0 5px 5px}
.quickDrawButtons>button{min-height:44px;min-width:0;padding:7px 3px;border:1px solid #c9a14a66;border-radius:5px;background:#353020;color:#f0cf77;font:inherit;font-size:11px;line-height:1.4;cursor:pointer;overflow-wrap:anywhere}
.quickDrawButtons>button:last-of-type{grid-column:1/-1}
.quickDrawButtons>button:hover:enabled{background:#55421f;border-color:#e7be55}
.quickDrawButtons>button:disabled{color:#9499a3;background:#252831;border-color:#ffffff14;cursor:not-allowed}
.quickDrawButtons>button small{display:block;font-size:9px;color:#939cab}
.quickDrawStatus{grid-column:1/-1;margin:0;color:#e7bd89;font-size:11px;line-height:1.6}
.quickDrawStatus:empty{display:none}
.referencePoolCard > button { display:flex; flex-direction:column; width:100%; height:auto; padding:0; border:1px solid #ffffff0b; border-radius:5px; overflow:hidden; color:inherit; background:#252934; text-align:left; cursor:pointer; font:inherit; }
.referencePoolCard > button:hover { border-color:#c6a74265; background:#2a2e39; }
.referenceCatalog button:focus-visible,.referenceCatalog a:focus-visible { outline:2px solid #ffd33f; outline-offset:4px; }
.referencePoolCover { display:flex; align-items:center; justify-content:center; width:100%; aspect-ratio:1.08; overflow:hidden; background:#1a1e27; }
.referencePoolCover > img { display:block; width:100%; height:100%; object-fit:contain; }
.referencePoolCardBody { display:flex; flex-direction:column; flex:1; width:100%; padding:17px 14px; }
.referencePoolEyebrow { display:block; color:#c1b078; font-size:9px; line-height:1.6; letter-spacing:.5px; }
.referencePoolCardBody > strong { display:block; margin:8px 0 16px; font-size:13px; line-height:1.65; font-weight:650; overflow-wrap:anywhere; }
.referencePoolMetrics { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:10px; align-items:end; width:100%; margin-top:auto; padding-top:2px; }
.referencePoolTestPrice { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px; min-width:0; color:#ffd33f; }
.referencePoolTestPrice > strong { font-size:22px; font-weight:780; line-height:1.3; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.referencePoolTestPrice > small { color:#b7bfcd; font-size:9px; line-height:1.6; }
.referencePoolAvailability { display:flex; flex-direction:column; gap:5px; min-width:0; text-align:right; }
.referencePoolAvailability > span { color:#949fb1; font-size:9px; line-height:1.5; }
.referencePoolAvailability > strong { color:#dce3ed; font-size:13px; line-height:1.4; font-weight:650; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.referencePoolAvailability > strong > small { color:#9eaabb; font-size:10px; font-weight:500; }
.referencePoolProgress { display:block; width:100%; height:4px; min-width:0; overflow:hidden; border:0; border-radius:2px; background:#ffffff0b; accent-color:#74c68c; }
.referencePoolProgress::-webkit-progress-bar { border-radius:2px; background:#ffffff0b; }
.referencePoolProgress::-webkit-progress-value { border-radius:2px; background:#74c68c; }
.referencePoolProgress::-moz-progress-bar { border-radius:2px; background:#74c68c; }
.referencePoolCardBottom { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-top:17px; font-size:10px; line-height:1.5; }
.referencePoolCardBottom > span:first-child { color:#d0d5df; }
.referencePoolCardBottom > span:last-child { color:#f0d775; }
.referenceCatalogInfo { width:100%; margin:28px 0 0; padding:18px 0; border-top:1px solid #ffffff0c; color:#929cad; font-size:11px; line-height:1.9; }
.referenceCatalogInfo summary { cursor:pointer; min-height:44px; align-content:center; color:#bdc4d1; }
.referenceCatalogInfo p { margin:9px 0; }
.referenceCatalogInfo ul { padding-left:20px; margin:12px 0; }
.referenceCatalogInfo li { padding:8px 0; overflow-wrap:anywhere; }
.referenceCatalogInfo li > span { display:block; font-size:10px; }
.referenceCatalog a { color:#d2bd75; text-underline-offset:4px; }
.referencePoolPreview { padding:32px 0 40px; }
.referencePoolHeading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:28px; }
.referencePoolHeading h1 { font-size:28px; line-height:1.6; margin:7px 0; text-wrap:balance; }
.referencePoolHeading p { color:#a6afbf; font-size:11px; line-height:1.8; margin:0; }
.referenceCatalogBack { flex-shrink:0; min-height:44px; padding:10px 16px; border:1px solid #ffffff1a; border-radius:5px; background:#2c303b; color:#dce1e9; font:inherit; font-size:12px; cursor:pointer; }
.referencePoolOverview { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:36px; align-items:center; padding:24px; margin-bottom:30px; border:1px solid #ffffff0b; border-radius:6px; background:#242833; }
.referencePoolOverviewImage { display:flex; align-items:center; justify-content:center; height:270px; min-width:0; }
.referencePoolOverviewImage > img { display:block; width:100%; height:100%; object-fit:contain; }
.referencePoolTierCount { display:block; margin:12px 0; color:#ffd33f; font-size:52px; line-height:1.3; }
.referencePoolTierCount small { margin-left:12px; font-size:14px; font-weight:500; color:#b5bfce; }
.referencePoolOverview p { max-width:550px; color:#a4afbf; font-size:12px; line-height:1.9; }
.referencePoolOverview a { display:inline-flex; align-items:center; min-height:44px; font-size:11px; }
.referencePrizeGrid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:20px; }
.referencePrizeCard { min-width:0; overflow:hidden; border:1px solid #ffffff0b; border-top:2px solid var(--preview-grade,#77808f); border-radius:5px; background:radial-gradient(ellipse at 50% 0,color-mix(in srgb,var(--preview-grade,#77808f) 8%,transparent),transparent 70%),#252934; }
.referencePrizeImage { display:flex; align-items:center; justify-content:center; height:190px; padding:14px; }
.referencePrizeImage > img { display:block; width:100%; height:100%; object-fit:contain; }
.referencePrizeBody { padding:0 14px 16px; }
.referencePrizeGrade { display:inline-flex; align-items:center; gap:6px; min-height:24px; padding:3px 8px; border:1px solid color-mix(in srgb,var(--preview-grade,#77808f) 45%,transparent); border-radius:3px; color:#f1f1f5; background:color-mix(in srgb,var(--preview-grade,#77808f) 8%,transparent); font-size:10px; line-height:1.5; }
.referencePrizeGrade:before { content:""; width:4px; height:4px; border-radius:50%; background:var(--preview-grade,#77808f); }
.referencePrizeBody h2 { min-height:42px; margin:12px 0 16px; font-size:13px; line-height:1.65; font-weight:650; overflow-wrap:anywhere; }
.referencePrizeBody p { display:flex; flex-direction:column; gap:5px; margin:0; font-size:10px; line-height:1.6; color:#99a4b7; }
.referencePrizeBody p strong { color:#d7deea; font-size:13px; font-weight:550; }
.referenceImageMissing { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; width:100%; height:100%; min-height:90px; padding:15px; color:#8e99aa; text-align:center; font-size:10px; line-height:1.8; }
.referenceImageMissing > span { font-size:30px; opacity:.5; }
@media(max-width:1279px) {
  .referenceCatalogGrid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .referencePrizeGrid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media(max-width:767px) {
  .referenceCatalogGrid,.referencePrizeGrid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .referencePoolCardBody { padding:12px 10px; }
  .referencePoolCardBody > strong { font-size:11px; margin-bottom:13px; }
  .referencePoolMetrics { grid-template-columns:minmax(0,1fr); gap:10px; }
  .referencePoolAvailability { text-align:left; gap:4px; }
  .referencePoolTestPrice > strong { font-size:21px; }
  .referencePoolAvailability > strong { font-size:12px; }
  .referencePoolCardBottom { margin-top:14px; }
  .referencePoolCardBottom { font-size:9px; }
  .referencePoolEyebrow { font-size:8px; }
  .referencePoolPreview { padding-top:24px; }
  .referencePoolHeading { flex-direction:column; align-items:flex-start; gap:15px; }
  .referencePoolHeading h1 { font-size:21px; }
  .referencePoolOverview { grid-template-columns:minmax(0,1fr); gap:18px; padding:16px; }
  .referencePoolOverviewImage { height:220px; }
  .referencePoolTierCount { font-size:38px; }
  .referencePoolOverview p { font-size:11px; }
  .referencePrizeImage { height:140px; padding:10px; }
  .referencePrizeBody { padding:0 10px 14px; }
  .referencePrizeBody h2 { font-size:11px; }
  .referencePrizeBody p { font-size:9px; }
  .referencePrizeGrade { font-size:9px; }
  .referenceCatalogInfo { font-size:10px; }
}
@media(max-width:359px) {
  .referencePrizeImage { height:116px; }
  .referencePoolCardBottom { align-items:flex-start; flex-direction:column; }
}
@media(prefers-reduced-motion:reduce) { .referenceCatalog * { animation:none; transition:none; } }