/* Comic Cut Collectors Stage 2 bundle. Source order preserved exactly from the page. */

/* === SOURCE: 001-inline-style.css === */
:root {
    --bg: #0f0623;
--bg-accent:
  /* Top-left glow (original) */
  radial-gradient(1200px 800px at 10% -10%, #250f5a 0%, transparent 55%),

  /* Bottom-right glow (mirrored) */
  radial-gradient(1200px 800px at 95% 110%, #250f5a 0%, transparent 35%),

  /* Dark fade */
  radial-gradient(900px 600px at 120% 10%, #000000 0%, transparent 40%),

  /* Base */
  #000000;

    --panel: #15171a;
    --panel-2: #101114;
    --border: rgba(255,255,255,.08);
    --muted: #a8acb3;
    --text: #eef0f6;
    --brand: #9a8bff;
    --focus: #ffffff;
    --focus-ring: rgba(111, 49, 255, 0.28);
    --shadow: 0 10px 30px rgba(0,0,0,.45);
    --radius: 14px;
    --topbar-h: 56px;
  }
  @media (prefers-color-scheme: light) {
    :root { color-scheme: dark; }
  }
/* Prevent iOS/Android tap highlight “flash” on buttons/thumbnails */
*{ box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

button, a, .icon-btn, .altthumb, .thumb, .altthumbs-wrap, .altthumbs{
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
    touch-action: manipulation;
}

/* Keep keyboard accessibility without showing outlines on touch */
.icon-btn:focus{ outline: none; }
.icon-btn:focus-visible{ outline: 2px solid rgba(255,255,255,.35); outline-offset: 2px; }
/* ✅ Always cover the viewport with your gradient (prevents black overscroll) */
html, body{
  height: 100%;
  margin: 0;
  touch-action: pan-x pan-y;
}

html{
  background: #000; /* fallback */
}

html::before{
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background: var(--bg-accent);
  background-repeat: no-repeat;
  background-size: cover;
  transform: translateZ(0); /* helps iOS paint */
}

/* Body is transparent over the gradient */

body{
  margin: 0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
  background: transparent;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding-top: var(--topbar-h);
  min-height: 100vh;
  padding-bottom: 60px; /* for fixed footer on desktop */
}
  /* Top bar */
.topbar {
  position: fixed;
  top: 0;
  transform: translate3d(0,0,0);
  backface-visibility: hidden;
  left: 0;
  right: 0;
  height: var(--topbar-h);
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 16px;
  background: linear-gradient(180deg, rgba(21,23,26,.75) 0%, rgba(16,17,20,.55) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}

/* One centered home logo is shared by desktop and mobile. The logo fills the
   existing 56px bar without changing the bar's height. */
.topbar > .center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 1;
}
.topbar > .left,
.topbar > .right {
  position: relative;
  z-index: 2;
}
.topbar-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  padding: 0;
  line-height: 0;
  pointer-events: auto;
  text-decoration: none;
}
.topbar-logo img {
  display: block;
  width: 52px;
  height: 52px;
  object-fit: contain;
}
  .icon-btn{ display:inline-flex; align-items:center; justify-content:center; padding:10px; border:1px solid var(--border); border-radius:10px; background:var(--panel); color:var(--text); cursor:pointer; transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease; }
  @media (hover: hover) and (pointer: fine) {
  .icon-btn:hover{ background: rgba(255,255,255,.08); }
}
  .icon-btn.is-active{ color:#ffffff; border-color:rgba(255,255,255,.35); background:rgba(255,255,255,.10); }
  .icon-btn.is-active .material-symbols-outlined{ font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24; }
  .material-symbols-outlined{ font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; font-size:22px; line-height:1; }

  /* Flyouts */
  .flyout-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.45); backdrop-filter: blur(2px); z-index:120; display:none; opacity:0; transition:opacity .2s ease; }
  .flyout-overlay.open{ display:block; opacity:1; }
  .flyout{ position:fixed; top:0; bottom:0; width:min(88vw, 380px); background:linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%); border:1px solid var(--border); box-shadow:var(--shadow); z-index:130; display:flex; flex-direction:column; transform: translateX(var(--start-x)); transition: transform .25s ease; }
  .flyout.open{ transform: translateX(0); }
  .flyout.left{ left:0; border-left:none; --start-x:-100%; }
  .flyout.right{ right:0; border-right:none; --start-x:100%; }
  .flyout header{ display:flex; align-items:center; justify-content:space-between; padding:12px; border-bottom:1px solid var(--border); }
  .flyout .content{ padding:12px; overflow:auto; display:grid; gap:10px; font-size:14px; line-height:1.5; }
  /* Layout */
  .container{
  max-width:1080px;
  margin:0 auto;
  padding:18px 16px 16px;
  display:block;          /* no grid here */
  flex: 1 0 auto;
}
 header.page{
  display:grid;
  gap:5px;
  margin: 5px auto 0px; /* ↓ from 4px to 0px */
  max-width:720px;        /* NEW – match searchwrap */
}

@keyframes purplePulse {
  0% {
    filter: brightness(1) saturate(1);
  }
  50% {
    filter: brightness(1.12) saturate(1.25);
  }
  100% {
    filter: brightness(1) saturate(1);
  }
}

  .eyebrow{ font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); font-weight:700; }
  h2.page-title{ font-size:clamp(22px, 3.2vw, 34px); line-height:1.2; margin:0; }
  .subtitle{ color:var(--muted); max-width:70ch; }
  /* Search */
  .searchwrap{
  position: relative;   /* ✅ anchor for dropdown */
  top: auto;            /* ✅ prevents header gap */
  z-index: 50;
  padding-top: 10px;
  backdrop-filter: blur(6px);
  width: 100%;
  display: flex;
  align-items: center;
  gap: 4px;
  max-width: 720px;
  margin: 0 auto;
}

  .searchbar{ position:relative; width:100%; }

  /* Desktop-only navigation sizing. The row keeps its existing 675px cap,
     every control remains 44px tall, and the combined 12px + 8px top spacing
     creates a 20px gap below the fixed top bar. */
  @media (min-width:781px){
    body > .container{
      padding-top:12px;
    }
    body > .container > .searchwrap{
      max-width:675px;
      padding-top:8px;
    }
    .searchwrap > .searchbar{
      flex:1 1 auto;
      width:auto;
      min-width:0;
      height:44px;
    }
    .searchwrap > .searchbar > input{
      height:44px;
    }
  }
  .searchbar input{ width:100%; padding:12px 46px; background:linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%); color:var(--text); border:1px solid var(--border); border-radius:var(--radius); font-size:16px; outline:none; box-shadow:var(--shadow); transition: border-color .15s ease, box-shadow .2s ease; }
  .searchbar input:focus-visible{ border-color: var(--focus); box-shadow: 0 0 0 3px var(--focus-ring), var(--shadow); }
  @media (hover: hover) and (pointer: fine) {
  .searchbar input:hover{
    border-color: #ffffff;
  }
}
  .searchbar .icon{ position:absolute; left:14px; top:50%; transform:translateY(-50%); opacity:.65; pointer-events:none; }
  .clearbtn{ position:absolute; right:6px; top:50%; transform:translateY(-50%); border:0; background:transparent; color:var(--muted); padding:8px; border-radius:10px; cursor:pointer;  display:none;}
  @media (hover: hover) and (pointer: fine) {
  .clearbtn:hover{ color:var(--text); }
}
  /* Autocomplete */

/* Autocomplete (full width of search row, but no layout shifting) */
.ac{
  position: absolute;
  left: 0;
  right: 0;

  /* anchor it under the searchwrap row without using top on searchwrap */
  top: calc(100% + 10px);

  width: 100%;
  transform: none;

  background: linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 6px;
  box-shadow: var(--shadow);
  max-height: 360px;
  overflow: auto;
  display: none;
  z-index: 60;

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.ac.open{ display:block; }

  .ac-section{ padding:6px 6px 10px; }
  .ac-title{ display:flex; align-items:center; gap:8px; padding:8px 10px; font-weight:700; font-size:13px; color:var(--text); background:rgba(255,255,255,.03); border-radius:10px; border:1px solid var(--border); }
  .ac-meta{ margin-left:auto; font-weight:600; color:var(--muted); font-size:12px; }
  .ac-subtitle{ font-size:13px; font-weight:600; color:var(--muted); margin:6px 0 4px 8px; display:flex; align-items:center; gap:6px; cursor:pointer; user-select:none; }
  .ac-subtitle .material-symbols-outlined{ font-size:16px; line-height:1; opacity:.8; }
  .ac-list{ margin-top:6px; display:grid; gap:4px; }
  .ac-item{ cursor:pointer; padding:10px 12px; border-radius:10px; border:1px solid transparent; display:grid; grid-template-columns:1fr auto; align-items:center; gap:8px; }
  @media (hover: hover) and (pointer: fine) {
  .ac-item:hover{ background:rgba(255,255,255,.04); border-color:var(--border); }
}
  .ac-item[aria-selected="true"]{ background:rgba(255,255,255,.04); border-color:var(--border); }
  .ac-issue{ font-size:14px; font-weight:600; }
  .ac-sub{ font-size:12px; color:var(--muted); }
  .ac-empty{ padding:10px; font-size:13px; color:var(--muted); }
  /* Results */
  .result{ margin-top:18px; width:100%; display:grid; justify-items:center; }
 .card {
  width: 100%;
  max-width: 900px;
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 16px;
  margin-bottom: 18px;
  /* ✨ Glass effect */
  background: rgba(0, 0, 0, 0.08); /* transparent white layer */
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  /* 🌫️ White border and shape */
  border: 1px solid rgba(46, 46, 46, 0.5);
  border-radius: var(--radius);
  /* 📦 Shadow & spacing */
  padding: 14px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.45);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
  .thumb{ position:relative; overflow:hidden; display:grid; justify-items:center; align-content:start; }
  .thumb img{ width:100%; aspect-ratio: 3/4; height:auto; object-fit:contain; border-radius:2px; background:rgba(255,255,255,.04); display:block; }
  .altthumbs-wrap{
    margin-top:8px;
    max-height:210px;
    overflow-y:auto;
    overflow-x:hidden; /* prevent sideways scroll/jitter on mobile */
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    border:1px solid var(--border);
    border-radius:10px;
    padding:6px;
    background:rgba(255,255,255,.04);
  }
  .altthumbs{ display:grid; grid-template-columns:repeat(auto-fit, minmax(165px, 1fr)); gap:6px; }
  .altthumb{ background:transparent; border:1px solid var(--border); border-radius:8px; padding:2px; cursor:pointer; }
  @media (hover: hover) and (pointer: fine) {
  .altthumb:hover{ border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.03); }
}
  .altthumb img{ width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:6px; display:block; }
  .altthumbs .alt-divider{ grid-column:1 / -1; height:1px; background:var(--border); margin:6px 0; }

  /* Owner section divider inside thumbnail window */
  .altthumbs .alt-owner-divider{
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 8px 0 6px;
    opacity: 0.9;
    width: 100%;
    min-width: 0;
  }
  .altthumbs .alt-owner-divider .lbl{
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 85%;
    min-width: 0;
  }
  .altthumbs .alt-owner-divider .line{
    height: 1px;
    flex: 1;
    background: var(--border);
    min-width: 0;
  }
  .pillgrid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:10px; }
  .pill{ background:rgba(255,255,255,.04); border:1px solid var(--border); padding:8px 10px; border-radius:12px; font-size:13px; min-height:40px; display:grid; gap:3px; overflow-wrap:anywhere; }
  .pill label{ color:var(--muted); font-size:11px; }
  .pill.pill-link{ cursor:pointer; }
  @media (hover: hover) and (pointer: fine) {
  .pill.pill-link:hover{ border-color: rgba(255,255,255,.6); background: rgba(255,255,255,.08); }
}
  .pill.pill-link:focus-visible{ outline: 2px solid rgba(255,255,255,.35); outline-offset: 2px; }
  .pill select {
    width: 100%;
    background: transparent;
    border: none;
    color: var(--text);
    font-size: 13px;
    padding: 0;
    margin: 0;
    outline: none;
  }
  .pill select option {
    color: #000;
  }
  .more{ margin-top:12px; background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:12px; max-height:330px; overflow:auto; }
  
  .kv{ display:grid; grid-template-columns:220px 1fr; gap:6px; padding:10px 12px; border-bottom:1px dashed rgba(255,255,255,.06) }
  .kv:last-child{ border-bottom:none; }
  .kv .v{ overflow-wrap:anywhere; }
  .empty{ margin-top:24px; border:1px dashed var(--border); border-radius:var(--radius); padding:24px; text-align:center; color:var(--muted); }
  #result .empty{ margin-top:22px; padding-top:12px; padding-right:24px; padding-bottom:16px; padding-left:24px; }
  *{ scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.25) transparent; }
  *::-webkit-scrollbar{ height:10px; width:10px; }
  *::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.25); border-radius:20px; }
  *::-webkit-scrollbar-track{ background: transparent; }
  @media (max-width: 780px){
    .card{ grid-template-columns:140px 1fr; }
    .pillgrid{ grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
    .kv{ grid-template-columns:120px 1fr; }

   /* Let the right column's children (pill box + CSV panel) participate in the card grid */
.card > :nth-child(2){ display: contents; }
/* Pill box stays in the right column (unchanged visually) */
.card .pillgrid{ grid-column: 2; }
/* The scrollable info window spans across both columns under thumb + pills */
.card .more{ grid-column: 1 / -1; }
.details-toggle{ grid-column: 1 / -1; }
/* Prevent any accidental horizontal overflow while keeping your look */
.card, .card > *{ min-width: 0; }
 html{ background-attachment: scroll; }  /* instead of body */
  .searchwrap{ position: relative; top:auto; backdrop-filter:none; }
  }
  @media (prefers-reduced-motion: reduce){ .card, .searchbar input, .thumb img, .flyout, .icon-btn, .altthumb img, .mc-issue-overlay, .mini-issue-header img { transition:none !important; animation:none !important; } }
  /* Remove box, border, radius, and padding for topbar icons */
.topbar .icon-btn {
  border: none;
  background: transparent;
  border-radius: 0;
  padding: 0;
  margin: 0;
  box-shadow: none;
}
@media (hover: hover) and (pointer: fine) {
.topbar .icon-btn:hover {
  background: transparent;
  opacity: 0.75; /* subtle hover cue */
}
}

/* Make checklist hover match shuffle hover */
@media (hover: hover) and (pointer: fine) {
#listBtn.icon-btn:hover{
  border-color: rgba(255,255,255,0.6) !important;
  background: rgba(255,255,255,0.08) !important;
  opacity: 1 !important; /* important: prevents the faded look */
}
}

#listBtn.icon-btn:focus,
#listBtn.icon-btn:focus-visible{
  outline: none;
  box-shadow: none;
}
.icon-btn[disabled],
.icon-btn:disabled {
  opacity: 0.4;                 /* dim greyed look */
  cursor: not-allowed;          /* disabled pointer */
  background: var(--panel-2);   /* darker grey background */
  border-color: rgba(255,255,255,0.05);
  color: var(--muted);          /* softer icon/text */
  pointer-events: none;         /* block interaction */
}
@media (hover: hover) and (pointer: fine) {
.icon-btn[disabled]:hover {
  background: var(--panel-2);   /* prevent hover light-up */
}
}
/* desktop/tablet default */
#result .empty .protip-img { max-width: 60%; }
/* phones: make it bigger + reduce only the bottom gap */
@media (max-width: 780px){
  #result .empty .protip-img { max-width: 90%; margin: 0 auto 4px; }
  #result .empty small { font-size: 14px; line-height: 1.3; display:block; text-align:center; padding:0 8px; }
  #result .empty { padding-top:16px; padding-right:10px; padding-bottom:6px; padding-left:10px; }
}
.subtitle {
  visibility: hidden;
  height: 2px;   /* ↓ almost no space */
  line-height: 0;
  padding: 0;
  margin: 0;
}
#site-footer{
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align:center;
  color:var(--muted);
  font-size:13px;
  padding:12px 0;
  border-top:1px solid var(--border);
  margin-top:0;         /* IMPORTANT: remove the big push-up margin */
  background: rgba(0,0,0,0.85); /* optional but usually needed so it’s readable */
  backdrop-filter: blur(10px);  /* optional, matches your glass style */
  z-index: 80; /* higher than result content, lower than flyouts (120/130) */
}
#site-footer span{ opacity:.7; }
/* ============================
   Shared transitions
   ============================ */
.altthumbs-wrap,
.more,
.pill,
.card .icon-btn {
  transition: border-color 0.2s ease, background 0.2s ease;
}
/* ============================
   Desktop / pointer hover
   ============================ */
/* ALT THUMB WINDOW + INFO PANEL */
@media (hover: hover) and (pointer: fine) {
.more:hover {
  border-color: rgba(255,255,255,0.6);
}
}
/* ALT THUMBNAILS */
@media (hover: hover) and (pointer: fine) {
.altthumb:hover {
  border-color: rgba(255,255,255,0.6) !important;
  background: rgba(255,255,255,0.08);
}
}

/* PILL HOVER — only if pill contains a dropdown */
@media (hover: hover) and (pointer: fine) {
.pill.has-dd:hover {
  border-color: rgba(255,255,255,0.6);
  background: rgba(255,255,255,0.08);
}
}

@media (hover: none) {
  /* Pill active state — only if pill contains a dropdown */
  .pill.has-dd:active {
    border-color: rgba(255,255,255,0.8);
    background: rgba(255,255,255,0.12);
  }
}

/* CARD ICON BUTTONS (zoom / rotate / edit) */
@media (hover: hover) and (pointer: fine) {
.card .icon-btn:hover {
  border-color: rgba(255,255,255,0.6);
  background: rgba(255,255,255,0.08);
}
}
/* ============================
   Mobile / touch states
   ============================ */
@media (hover: none) {
  /* Keep :active highlight for the info window */
  .more:active {
    border-color: rgba(255,255,255,0.8) !important;
    background: rgba(255,255,255,0.05);
  }
  /* Pill active state */
  .pill:active {
    border-color: rgba(255,255,255,0.8);
    background: rgba(255,255,255,0.12);
  }
  /* ✅ Mobile: remove thumbnail tap highlight (prevents border "jump" and flash) */
  .altthumb:active {
    border-color: var(--border);
    background: transparent;
  }
  /* Also remove focus outlines on tap for these buttons */
  .altthumb:focus { outline: none; }
  .altthumb:focus-visible { outline: none; }
  /* Prevent transition flashes on rapid re-render */
  .altthumb { transition: none !important; }
  /* Icon buttons tap highlight */
  .card .icon-btn:active {
    border-color: rgba(255,255,255,0.8);
    background: rgba(255,255,255,0.12);
  }
}
/* Hover for shuffle + popup buttons */
@media (hover: hover) and (pointer: fine) {
#myCollectionMineBtn.icon-btn:hover,
#myCollectionBtn.icon-btn:hover,
.zoom-popup-close:hover,
.zoom-popup-btn:hover {
  border-color: rgba(255,255,255,0.6) !important;
  background: rgba(255,255,255,0.08) !important;
}
}
/* Subset hover: turn white */
@media (hover: hover) and (pointer: fine) {
.ac-subtitle:hover {
  color: #ffffff !important;
}
}
/* Subset clicked/expanded: stays white */
.ac-subtitle[aria-expanded="true"] {
  color: #ffffff !important;
}
/* Optional: also brighten the chevron icon */
@media (hover: hover) and (pointer: fine) {
.ac-subtitle:hover .material-symbols-outlined {
  color: #ffffff !important;
  opacity: 1 !important;
}
}
.ac-subtitle[aria-expanded="true"] .material-symbols-outlined {
  color: #ffffff !important;
  opacity: 1 !important;
}
/* Custom dropdown (Option B) */
.custom-dd-wrapper {
  position: relative;
  width: 100%;
}
.custom-dd-trigger {
  background: transparent;
  padding: 2px 0;
  font-size: 13px;
  cursor: pointer;
}
.custom-dd-list {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  max-height: 150px;       /* 👈 YOUR NEW HEIGHT — CHANGE THIS */
  overflow-y: auto;
  box-shadow: var(--shadow);
  display: none;
  z-index: 5000;
}
.custom-dd-list.open {
  display: block;
}
.custom-dd-item {
  padding: 8px 10px;
  cursor: pointer;
  font-size: 13px;
}
@media (hover: hover) and (pointer: fine) {
.custom-dd-item:hover {
  background: rgba(255,255,255,0.08);
}
}
.dd-arrow {
  font-size: 10px;
  opacity: 0.6;
  float: right;
  pointer-events: none;
  margin-left: 6px;
  display: none !important;
}
.details-toggle {
  width: 100%;
  text-align: left;
  padding: 6px 0;
  margin-top: 10px;
  margin-bottom: 4px;
  background: none;
  border: none;
  border-bottom: 1px solid var(--border);
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  cursor: pointer;
  overflow:auto; 
}
@media (hover: hover) and (pointer: fine) {
.details-toggle:hover {
  color: var(--accent, #fff);
  border-bottom-color: var(--accent, #fff);
}
}
.details-toggle::after {
  content: " ▼";
  float: right;
  opacity: 0.7;
}
.details-toggle[aria-expanded="true"]::after {
  content: " ▼";
}
@media (max-width:780px){
  /* Mobile: background scrolls (avoids fixed-bg bugs) */
  html{
    background-attachment: scroll;
  }
  /* Mobile only: remove footer bar/text entirely */
  body{
    padding-bottom: 0 !important;
  }
  #site-footer{
    display: none !important;
  }
  #result{
    padding-bottom: 24px !important;
  }
}
/* ===== Newly Added Sets ticker under search bar ===== */
.new-sets-viewport {
  position: relative;
  overflow: hidden;
  height: 1.4em; /* adjusted in JS */
}
.new-sets-list {
  list-style: none;
  margin: 0;
  padding: 0;
  transition: transform 0.35s ease-out;
}
.new-sets-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  padding: 2px 0;
}
.new-sets-pill {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  padding: 2px 6px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,0.03);
  color: var(--muted);
}
@media (max-width: 780px) {
}

/* Color enhancements for ticker pills */
.new-sets-pill.new {
  background: rgba(154, 139, 255, 0.18); /* soft purple */
  border-color: rgba(154, 139, 255, 0.45);
  color: #cfc5ff;
  font-weight: 700;
}

.new-sets-pill.feature {
  background: rgba(0, 255, 209, 0.14); /* teal glow */
  border-color: rgba(0, 255, 209, 0.45);
  color: #9fffe8;
  font-weight: 700;
}

/* Center the ticker under the search + shuffle */
.new-sets-viewport {
  margin: 0 auto;
  text-align: center;
  display: flex;
  justify-content: center;
}

.new-sets-list {
  text-align: left; /* keep text aligned but container centered */
}

/* Desktop spacing between the search controls, ticker, and home slider. */
.new-sets-viewport {
  margin-top: 11px !important;
  margin-bottom: 0px !important;
}

.result {
  margin-top: 11px !important;
}

.comic-cut-nav{
  width:100%;
  max-width:none;
  margin:10px 0 12px;
  display:none;
  align-items:center;
  gap:10px;
  padding:0;
  border:none;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.comic-cut-nav.is-visible{ display:flex; }
.card .comic-cut-nav{
  grid-column:1 / -1;
}
.comic-cut-nav-btn{
  appearance:none;
  border:1px solid transparent;
  background:transparent;
  color:var(--text);
  font-size:13px;
  font-weight:700;
  min-height:40px;
  padding:8px 10px;
  border-radius:12px;
  cursor:pointer;
  display:flex;
  align-items:center;
  flex:1 1 0;
  transition:border-color .18s ease, background .18s ease, transform .18s ease, opacity .18s ease;
}
@media (hover: hover) and (pointer: fine) {
.comic-cut-nav-btn:hover{
  border-color:rgba(255,255,255,.6);
  background:rgba(255,255,255,.08);
  opacity:1;
}
}
.comic-cut-nav-btn:active{ transform:translateY(1px); }
.comic-cut-nav-btn[disabled]{ opacity:.38; cursor:default; pointer-events:none; }
.comic-cut-nav-btn:first-child{ justify-content:flex-start; text-align:left; }
.comic-cut-nav-btn:last-child{ justify-content:flex-end; text-align:right; }
@media (max-width:780px){
  .comic-cut-nav{ margin:0 0 10px; padding:0; gap:8px; }
  .comic-cut-nav-btn{ font-size:13px; min-height:38px; padding:8px; }
}

/* Make ticker text smaller on mobile */
@media (max-width: 480px) {
  .new-sets-list li {
    font-size: 11px;
  }

  .new-sets-pill {
    font-size: 9px;
    padding: 1px 4px;
  }

  .new-sets-viewport {
    margin-top: 18px !important; /* keeps spacing nice */
  }
}

.new-sets-pill.protip {
  background: rgba(255, 214, 0, 0.16); /* soft yellow */
  border-color: rgba(255, 214, 0, 0.55);
  color: #ffe89a;
  font-weight: 800;
}

.ac-title--clickable {
  cursor: pointer;
  user-select: none;
}

@media (hover: hover) and (pointer: fine) {

.ac-title--clickable:hover {
  background: rgba(255, 255, 255, 0.06);
}
}

.ac-title--clickable:active {
  background: rgba(255, 255, 255, 0.10);
}

.ac-title--clickable:focus {
  outline: 2px solid rgba(255, 255, 255, 0.25);
  outline-offset: 2px;
}


.view-toggle-row{
  width:100%;
  display:flex;
  justify-content:center;
  gap:10px;
  margin: 0 0 14px;
  flex-wrap:wrap;
}
.view-toggle-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 38px 10px 14px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  color:var(--text);
  cursor:pointer;
  font-size:13px;
  font-weight:700;
  letter-spacing:.02em;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}
@media (hover: hover) and (pointer: fine) {
.view-toggle-btn:hover{
  border-color:rgba(255,255,255,.35);
  background:rgba(255,255,255,.08);
}
}
.view-toggle-btn[aria-pressed="true"]{
  border-color:rgba(154,139,255,.55);
  background:rgba(154,139,255,.18);
  color:#f3f0ff;
}
.view-toggle-btn .material-symbols-outlined{
  font-size:18px;
}
.comic-cuts-list{
  width:100%;
  display:grid;
  gap:8px;
  margin-top:10px;
}
.comic-cuts-head,
.comic-cuts-row{
  display:grid;
  grid-template-columns:minmax(0,2.6fr) minmax(84px,.9fr) minmax(84px,.9fr) repeat(4, minmax(72px,.75fr));
  gap:10px;
  align-items:center;
}
.comic-cuts-head{
  padding:0 4px 6px;
  border-bottom:1px solid rgba(255,255,255,.10);
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.comic-cuts-row{
  padding:12px;
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(255,255,255,.03);
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}
@media (hover: hover) and (pointer: fine) {
.comic-cuts-row:hover{
  border-color:rgba(255,255,255,.22);
  background:rgba(255,255,255,.06);
  transform:translateY(-1px);
}
}
.comic-cuts-row:focus{
  outline:2px solid rgba(255,255,255,.25);
  outline-offset:2px;
}
.comic-cuts-name,
.comic-cuts-sn,
.comic-cuts-cardnum{
  min-width:0;
  font-size:13px;
  font-weight:600;
}
.comic-cuts-name{
  overflow:visible;
  text-overflow:clip;
  white-space:normal;
  word-break:break-word;
}
.comic-cuts-sn,
.comic-cuts-cardnum{
  color:var(--muted);
  font-weight:700;
}
.comic-cuts-check{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
}
.comic-cuts-check .material-symbols-outlined{
  font-size:18px;
}
.comic-cuts-check.is-yes{ color:#ffffff; }
.comic-cuts-check.is-no{ color:rgba(255,255,255,.22); }
@media (max-width: 780px){
  .view-toggle-row{
    justify-content:flex-start;
  }
  .view-toggle-btn{
    flex:1 1 calc(50% - 10px);
    justify-content:center;
  }
  .comic-cuts-head,
  .comic-cuts-row{
    grid-template-columns:minmax(0,1.9fr) minmax(44px,.52fr) minmax(50px,.56fr) repeat(4, minmax(34px,.38fr));
    gap:4px;
  }
  .comic-cuts-head{
    font-size:9px;
    letter-spacing:.05em;
  }
  .comic-cuts-row{
    padding:10px 8px;
  }
  .comic-cuts-name,
  .comic-cuts-sn,
  .comic-cuts-cardnum{
    font-size:11px;
  }
  .comic-cuts-check .material-symbols-outlined{
    font-size:16px;
  }
}

.mini-results {
  width: 100%;
  display: grid;
  /* desktop: allow more than 3 per row, smaller tiles */
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 10px;
  margin-top: 10px;
}

/* Instagram-style tiles */

.mini-row {
  width: 100%;
  aspect-ratio: 3 / 4;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(255,255,255,0.03);
  overflow: hidden;
  cursor: pointer;
  user-select: none;
  position: relative;
  transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease;
  display: grid;
  place-items: center;
}

@media (hover: hover) and (pointer: fine) {

.mini-row:hover {
  border-color: rgba(255,255,255,0.22);
  background: rgba(255,255,255,0.06);
  transform: translateY(-1px);
}
}

.mini-row:active {
  transform: translateY(0px) scale(0.99);
  background: rgba(255,255,255,0.09);
}

.mini-row:focus {
  outline: 2px solid rgba(255, 255, 255, 0.25);
  outline-offset: 2px;
}

.mini-tile-img {
  width: 100%;
  height: 100%;
  object-fit: contain; /* keep your current image behavior */
  background: rgba(255,255,255,0.04);
  display: block;
}

.mini-issue-header{
  /* Issue cover tile inside the same grid as other mini results */
  padding: 0;
  display: block;
  cursor: pointer;
}

.mini-issue-header img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;

  /* OPEN (expanded) = black & white */
  filter: grayscale(1);
}

.mini-issue-header.mini-issue-collapsed img{
  /* CLOSED (collapsed) = color */
  filter: none;
  opacity: 1;
}

.mini-issue-label{
  font-size: 11px;
  display:none;
}

/* My Collection issue tile overlay (title + Open/Close button) */
/* Uses the same "mini result" popover feel: blurred tint over image + glass card + mini-popover-view button */
.mini-issue-header{ position: relative; overflow: hidden; }

/* Overlay layer (tint + blur over the cover image) */
.mc-issue-overlay{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 10px;

  /* mini-popover look */
  background: rgba(10,10,12,.28);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  /* interaction */
  pointer-events:none;

  /* Smooth reveal */
  opacity: 0;
  transform: translateY(10px) scale(0.99);
  transition:
    opacity 260ms cubic-bezier(0.2, 0.8, 0.2, 1),
    transform 260ms cubic-bezier(0.2, 0.8, 0.2, 1);
  will-change: opacity, transform;
}

/* Show on hover/focus (desktop/tablet) */
/* Show on hover/focus ONLY on devices that actually have hover */
@media (hover: hover) {
  .mini-issue-header:hover .mc-issue-overlay,
  .mini-issue-header:focus-within .mc-issue-overlay{
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Always show when expanded (so Close is visible) */
.mini-issue-header:not(.mini-issue-collapsed) .mc-issue-overlay{
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* On mobile, show only after first tap (mc-popover-open) */
.mini-issue-header.mc-popover-open .mc-issue-overlay{
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* If there is no imagecomic/cover, keep the overlay visible by default */
.mini-issue-header.mini-issue-no-cover .mc-issue-overlay{
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* Glass card */
.mc-issue-overlay-panel{
  font-size: 11px;
  pointer-events:auto; /* enable button clicks */
  width: 100%;
  max-width: 260px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.22);
  box-shadow: 0 16px 40px rgba(0,0,0,.35);
  padding: 10px 12px 12px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  text-align: center;
  font-family: Roboto, system-ui, -apple-system, Segoe UI, Arial, sans-serif;
}

.mc-issue-overlay-divider{
  margin: 4px 0 2px;
}

.mc-issue-overlay-footer{
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.mc-issue-overlay-count{
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .02em;
  color: rgba(255,255,255,.78);
  text-shadow: 0 2px 10px rgba(0,0,0,.55), 0 1px 2px rgba(0,0,0,.65);
}

/* Button sizing (button look comes from .mini-popover-view) */
.mc-issue-overlay-btn{
  width: auto;
  max-width: none;
  margin-top: 0;
  padding-left: 14px;
  padding-right: 14px;
}

.mc-issue-overlay-title{
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .02em;
  line-height: 1.15;
  color: rgba(255,255,255,0.95);
  text-shadow: 0 2px 10px rgba(0,0,0,.75), 0 1px 2px rgba(0,0,0,.85);

  display: -webkit-box;
  -webkit-box-orient: vertical;

  /* ✅ add both */
  line-clamp: 3;
  -webkit-line-clamp: 3;

  overflow: hidden;
}

@media (max-width: 480px){
  .mini-issue-header img{ width: 100%; height: 100%; }
}

.mini-thumb-ph {
  width: 100%;
  height: 100%;
  opacity: 0.35;
  background: repeating-linear-gradient(
    45deg,
    rgba(255,255,255,0.08),
    rgba(255,255,255,0.08) 10px,
    rgba(255,255,255,0.03) 10px,
    rgba(255,255,255,0.03) 20px
  );
}

/* ============================
   Mini tile corner flags
   ============================ */
.mini-flag{
  position: absolute;
  bottom: 6px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 6;

  font-size: 9px;
  font-weight: 800;
  letter-spacing: .10em;
  text-transform: uppercase;

  padding: 3px 6px;
  border-radius: 999px;

  border: 1px solid rgba(255,255,255,0.14);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
pointer-events: none;

  box-shadow:
    0 14px 28px rgba(0,0,0,.60),
    0 6px 16px rgba(0,0,0,.48),
    0 0 0 1px rgba(255,255,255,.10);

  text-shadow: 0 2px 10px rgba(0,0,0,.82), 0 1px 2px rgba(0,0,0,.92);
}

.mini-row.mini-popover-open .mini-flag{ display:none; }

/* Color themes */
.mini-flag.error{
  background: rgba(255, 60, 60, 0.16);
  border-color: rgba(255, 60, 60, 0.45);
  color: #ffffff;
}

.mini-flag.first-appearance{
  background: rgba(0, 255, 140, 0.14);
  border-color: rgba(0, 255, 140, 0.45);
  color: #ffffff;
}

.mini-flag.reprint{
  background: rgba(255, 214, 0, 0.16);
  border-color: rgba(255, 214, 0, 0.55);
  color: #ffffff;
}

.mini-flag.user-status{
  top: 8px;
  bottom: auto;
  left: 8px;
  transform: none;
  max-width: calc(100% - 16px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mini-flag.user-status.on-the-hunt{
  background: rgba(87, 168, 255, 0.18);
  border-color: rgba(87, 168, 255, 0.45);
  color: #ffffff;
}

.mini-flag.user-status.trade-sale{
  background: rgba(255, 146, 68, 0.18);
  border-color: rgba(255, 146, 68, 0.48);
  color: #ffffff;
}

.mini-flag.user-status.pc{
  background: rgba(163, 114, 255, 0.18);
  border-color: rgba(163, 114, 255, 0.48);
  color: #ffffff;
}


.mini-badge-stack{
  position:absolute;
  bottom:8px;
  left:50%;
  transform:translateX(-50%);
  z-index:7;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  width:calc(100% - 16px);
  pointer-events:none;
}

.mini-badge-stack .mini-flag{
  position:static;
  top:auto;
  bottom:auto;
  left:auto;
  transform:none;
  max-width:100%;
}

.mini-badge-divider{
  width:44px;
  height:1px;
  background:rgba(255,255,255,0.52);
  box-shadow:0 2px 10px rgba(0,0,0,.58), 0 0 10px rgba(255,255,255,.08);
  border-radius:999px;
}

.mini-flag.issue-meta{
  background:rgba(12,12,16,0.42);
  border-color:rgba(255,255,255,0.16);
  color:#ffffff;
}

/* Hide old row text UI in tile mode (kept for safety) */
.mini-left,
.mini-main,
.mini-issue,
.mini-meta,
.mini-dot,
.mini-arrow {
  display: none !important;
}

.mini-left
 {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.mini-thumb {
  width: 44px;
  height: 56px;
  flex: 0 0 auto;
  border-radius: 8px;
  overflow: hidden;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  display: grid;
  place-items: center;
}

.mini-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.mini-thumb-ph {
  width: 100%;
  height: 100%;
  opacity: 0.35;
  background: repeating-linear-gradient(
    45deg,
    rgba(255,255,255,0.08),
    rgba(255,255,255,0.08) 6px,
    rgba(255,255,255,0.03) 6px,
    rgba(255,255,255,0.03) 12px
  );
}

.mini-main {
  min-width: 0;
}

/* --- Anti-stretch rules for long titles (desktop + mobile) --- */
.mini-row { max-width: 100%; box-sizing: border-box; }
.mini-left { min-width: 0; }
.mini-main { min-width: 0; }
.mini-meta span { min-width: 0; }

@media (max-width: 900px) {
  .mini-results { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
}
@media (max-width: 520px) {
  /* mobile: 3 per row, slightly smaller */
  .mini-results { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .mini-row { border-radius: 10px; }
}

.mini-meta { font-size: 11px; line-height: 1.25; }
.mini-meta strong { font-size: 11px; font-weight: 400; }


/* Mobile nine-card pager geometry must be definite before lazy image metadata arrives. */
@media (max-width:780px), (hover:none) and (pointer:coarse){
  #result.result{
    grid-template-columns:minmax(0, 1fr) !important;
  }
  #result .set-gallery-owner-header,
  #result .set-gallery-owner-body{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    justify-self:stretch !important;
    box-sizing:border-box !important;
  }
  #result .ccc-mobile-paginated-mini-results{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    justify-self:stretch !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    align-items:start !important;
    box-sizing:border-box !important;
    contain:none !important;
    content-visibility:visible !important;
    transform:none !important;
  }
  #result .ccc-mobile-paginated-mini-results > .mini-row{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    aspect-ratio:3 / 4 !important;
    box-sizing:border-box !important;
    contain:none !important;
    content-visibility:visible !important;
    transform:none !important;
    -webkit-transform:none !important;
    backface-visibility:visible !important;
    -webkit-backface-visibility:visible !important;
  }
  #result .ccc-mobile-paginated-mini-results > .mini-row > .mini-tile-img{
    width:100% !important;
    height:100% !important;
    min-width:0 !important;
    display:block !important;
    object-fit:contain !important;
  }
}

/* ============================
   Mini-result popover (over clicked tile)
   ============================ */
.mini-popover{
  position: absolute;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 10px;
  /* blur + slight tint over the image */
  background: rgba(10,10,12,.28);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.mini-popover.open{ display:flex; }

.mini-popover-card{
  width: 100%;
  max-width: 260px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.22);
  box-shadow: 0 16px 40px rgba(0,0,0,.35);
  padding: 10px 12px 12px;  /* 🔻 was 14px 14px 16px */
  gap: 6px;                 /* 🔻 was 12px */
  display: grid;
  place-items: center;
  text-align: center;
  font-family: Roboto, system-ui, -apple-system, Segoe UI, Arial, sans-serif;
}

.mini-popover-cardnum{
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .02em;
  line-height: 1.15;
  color: rgba(255,255,255,.92);

  /* Keep long issue titles tidy */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mini-popover-actions{
  display:flex;
  justify-content: center;
  align-items:center;
  gap:8px;
  width: 100%;
}

/* Overlay View button (only affects the popover view button) */
.mini-popover-view {
  font-size: 11px;
  flex:0 0 auto;
  width:auto;
  border-radius: 14px;
  padding:6px 10px;
  font-weight: 800;
  letter-spacing: 0.02em;
  display:inline-flex;
  align-items:center;
  justify-content:center;

  border: 1px solid rgba(255,255,255,0.20);
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.95);

  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

.mini-popover-view .material-symbols-outlined{
  font-size:18px;
  line-height:1;
  display:block;
}

/* Keep overlay text and icons centered/aligned */
.mini-popover-card,
.mc-issue-overlay-panel{
  box-sizing:border-box;
}

.mini-popover-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}

.mini-popover-cardnum,
.mini-popover-serial,
.mc-issue-overlay-title,
.mc-issue-overlay-count{
  width:100%;
  text-align:center;
}

.mini-popover-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:auto;
  max-width:100%;
}

.mini-popover-view,
.mini-popover-hunt,
.mc-issue-overlay-btn{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  vertical-align:middle;
}

.mini-popover-view{
  min-height:44px;
  gap:0;
  flex:0 0 auto;
  width:auto;
  min-width:0;
}

.mini-popover-hunt,
.mc-issue-overlay-btn{
  min-height:44px;
}

.mini-popover-hunt .material-symbols-outlined,
.mc-issue-overlay-btn .material-symbols-outlined{
  font-size:20px;
  line-height:1;
  display:block;
}

.mc-issue-overlay-btn{
  width:auto;
  min-width:0;
  height:44px;
  padding:4px 10px;
}

.mini-popover-hunt {
  flex:0 0 auto;
  width:auto;
  min-width:0;
  height:auto;
  min-height:0;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:none;
  background:transparent;
  color:rgba(255,255,255,0.96);
  box-shadow:none;
  border-radius:0;
  transition:transform 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

.mini-popover-hunt .material-symbols-outlined{
  font-size:22px;
}

@media (hover: hover) and (pointer: fine) {

.mini-popover-hunt:hover{
  color:#ffffff;
  transform:translateY(-1px) scale(1.04);
}
}

.mini-popover-hunt:active{
  transform:translateY(0) scale(0.96);
}

.mini-popover-hunt.is-active{
  color:#ffffff;
}

.mini-popover-hunt.is-active .material-symbols-outlined{
  font-variation-settings: 'FILL' 1;
}

.mini-popover-hunt:disabled{
  opacity:.6;
  cursor:not-allowed;
  transform:none;
}

@media (hover: hover) and (pointer: fine) {

.mini-popover-view:hover {
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.30);
  transform: translateY(-1px);
}
}

.mini-popover-view:active {
  transform: translateY(0px) scale(0.99);
  background: rgba(255,255,255,0.16);
}

/* Mini-results subset header underline: fade to white on hover */
.mini-subset-header{
  border-bottom-color: rgba(255,255,255,0.10); /* default line */
  transition: border-bottom-color 0.22s ease;  /* 👈 fade */
}

@media (hover: hover) and (pointer: fine) {

.mini-subset-header:hover{
  border-bottom-color: #ffffff !important;     /* hover line */
}
}

/* Hide ticker while checklist dropdown is open */
body.ticker-hidden .new-sets-viewport{ display:none !important; }
body.browse-list-open #protipSlider,
body.browse-list-open #randomCardDayWrap{ display:none !important; }

  /* Ticker: hidden by default; shown only on first visit or logo click */
  .new-sets-viewport { display: none; }

  /* Prevent last result row from hiding under fixed footer */
#result {
  padding-bottom: 90px;
}

.mini-popover-divider{
  width: 100%;
  height: 1px;
  background: rgba(255,255,255,.18);
  margin: 3px 0 3px;   /* 🔻 was 6px 0 6px */
}

.mini-popover-serial{
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
  color: rgba(255,255,255,.78);
}

/* ============================
   Mini popover spacing tweaks
   - Pull Card # and Serial closer to the divider
   - Keep space between Serial and View button
   ============================ */
.mini-popover-cardnum{
  margin-bottom: 2px;   /* tighter above divider */
}

.mini-popover-divider{
  margin: 2px 0 2px;    /* tighter spacing around the line */
}

.mini-popover-serial{
  margin-top: 2px;      /* closer to divider */
  margin-bottom: 10px;  /* keeps space before View button */
}

/* keep View button from creeping upward */
.mini-popover-actions{
  margin-top: 0;
}

/* ===== Auth (login) UI in right flyout ===== */
.auth-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,0.03);
  color:var(--text);
  cursor:pointer;
  font-weight:800;
}
@media (hover: hover) and (pointer: fine) {
.auth-toggle:hover{ background:rgba(255,255,255,0.06); }
}
.auth-toggle .material-symbols-outlined{ font-size:20px; opacity:.85; }

.auth-card{
  padding:12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,0.02);
}
.auth-row{ display:grid; gap:8px; }
.auth-label{ font-size:12px; color:var(--muted); font-weight:600; }
.auth-input{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
  color:var(--text);
  outline:none;
}
.auth-input:focus-visible{ border-color: var(--focus); box-shadow: 0 0 0 3px var(--focus-ring), var(--shadow); }
.auth-actions{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:6px; }
.auth-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,0.04);
  color:var(--text);
  cursor:pointer;
}
@media (hover: hover) and (pointer: fine) {
.auth-btn:hover{ background:rgba(255,255,255,0.08); }
}
/* Align Request Membership button with the right edge of the login fields */
#authLoggedOut .auth-actions{
  width:100%;
}
#authLoggedOut #requestMembershipBtn{
  margin-left:auto;
}
#authLoggedOut #authStatus{
  flex-basis:100%;
}

.left-protip-shortcuts{
  display:grid;
  gap:8px;
  margin:0;
}
.left-protip-shortcut-btn{
  width:100%;
  justify-content:flex-start;
  gap:10px;
  font-weight:800;
}
.left-protip-shortcut-btn .material-symbols-outlined{
  font-size:20px;
  opacity:.9;
}

.left-support-btn{
  width:100%;
  box-sizing:border-box;
  margin-top:10px;
  text-decoration:none;
  font-weight:800;
}
.auth-status{ font-size:12px; color:var(--muted); }
.auth-status.ok{ color:#9be6b5; }
.auth-status.err{ color:#ff9aa2; }

/* Prevent iOS zoom on focus */
@media (max-width: 780px) {
  .auth-input,
  .searchbar input,
  input[type="email"],
  input[type="password"],
  input[type="text"] {
    font-size: 16px !important;
  }
}
.auth-input {
  line-height: 1.4;
}

@media (hover: hover) and (pointer: fine) {

.mini-subset-header:hover{
  border-bottom-color: #ffffff !important;
}
}

/* ===== Page magnifier (card-shaped) ===== */
.imagepage{ position: relative; width: 100%; }
.imagepage img{ -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; -webkit-user-drag: none; }

.page-magnifier{
  position:absolute;
  z-index: 50;

  width: 150px;
  height: 200px;
  margin: 0;

  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.18);
  box-shadow: 0 14px 28px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.08);

  /* ✅ OUTER cutout outline (white, bolder, further out) */
  outline: 2px dashed #fff;
  outline-offset: -2px;

  background-repeat: no-repeat;
  background-color: rgba(0,0,0,0.18);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);

  pointer-events: none;

  left: 50%;
  top: 50%;

  opacity: 0;
  transform: translate(-50%, -50%) translateY(2px) scale(0.92);
  transition:
    opacity .16s cubic-bezier(.2,.8,.2,1),
    transform .16s cubic-bezier(.2,.8,.2,1);
}

/* (removed the inner ::after cutout since you want it OUTSIDE the zoom area) */

.page-magnifier.on{
  opacity: 1;
  transform: translate(-50%, -50%) translateY(0) scale(1);
}

@media (max-width: 600px){
  /* Smaller lens on phones */
  .page-magnifier{ width: 110px; height: 150px; }
}

@media (prefers-reduced-motion: reduce){
  .page-magnifier{ transition:none !important; }
}

.imagepage.hide-cursor,
.imagepage.hide-cursor * {
  cursor: none !important;
}

/* When page image (imagepage mode) is active, fully disable native touch/drag */
.imagepage.page-active{
  width: 100%;
  overflow: hidden;
}

.imagepage.page-active img{
  touch-action: none;
  -webkit-user-drag: none;
  aspect-ratio: auto !important;
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: min(70vh, 70dvh, 560px);
  object-fit: contain;
}

@media (max-width: 780px){
  .imagepage.page-active img{
    max-height: min(58vh, 58dvh, 420px);
  }
}

@media (hover: none) and (pointer: coarse) {
  .custom-dd-trigger {
    pointer-events: none;
  }
}

/* ===== Add Card Modal ===== */
  .modal-overlay{
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: none;
    background: rgba(0,0,0,0.55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }
  .modal-overlay.open{ display:block; }

  .modal{
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);

    width: min(92vw, 820px);

    /* Use dynamic viewport height when available (prevents mobile browser chrome clipping) */
    max-height: min(88vh, 820px);
    max-height: min(88dvh, 820px);

    overflow: hidden;
    z-index: 2100;

    /* ✅ Ensure footer never gets clipped: header/body/footer as a flex column */
    display: none;
    flex-direction: column;

    border-radius: 18px;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
    box-shadow: var(--shadow);
  }
  .modal.open{ display:flex; }

  .modal header{
    flex: 0 0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding: 12px 14px;
    border-bottom: 1px solid var(--border);
  }
  .modal header strong{ font-size: 14px; letter-spacing: .02em; }

  .modal .modal-body{
    flex: 1 1 auto;
    padding: 12px 14px;
    overflow: auto;
    /* Let flexbox control height; avoids calc mistakes + clipping */
    max-height: none;
    -webkit-overflow-scrolling: touch;
  }

  .modal .modal-footer{
    flex: 0 0 auto;
    display:flex;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 14px;
    /* iOS safe area (home indicator) */
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--border);
    background: rgba(255,255,255,0.02);
  }
.form-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
}
@media (max-width: 780px){
  .form-grid{ grid-template-columns: 1fr; }
}

.form-field{
  display:grid;
  gap:6px;
  padding: 10px 10px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
}
.form-field label{
  font-size: 11px;
  color: var(--muted);
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.form-section{
  grid-column: 1 / -1;
  position: relative;
  z-index: 0;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  background: rgba(255,255,255,0.02);
  overflow: hidden;
}
.form-section.form-section--open{
  overflow: visible;
}
.form-section.has-open-dropdown{
  z-index: 20;
}
.form-section-body,
.form-field,
.modal-dd{
  position: relative;
  overflow: visible;
}
.form-field.has-open-dropdown{
  z-index: 25;
}
.form-section + .form-section{
  margin-top: 2px;
}
.form-section-header{
  width: 100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  padding: 12px 14px;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  border-radius: inherit;
  background: rgba(255,255,255,0.03);
  color: var(--text);
  cursor: pointer;
  text-align: left;
}
@media (hover: hover) and (pointer: fine) {
.form-section-header:hover{
  background: rgba(255,255,255,0.06);
}
}
.form-section--locked-collapsed .form-section-header{
  cursor: not-allowed;
  opacity: .62;
}
@media (hover: hover) and (pointer: fine) {
.form-section--locked-collapsed .form-section-header:hover{
  background: rgba(255,255,255,0.03);
}
}
.form-section-header:focus-visible{
  outline: 2px solid rgba(255,255,255,.25);
  outline-offset: -2px;
}
.form-section-title{
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.form-section-chevron{
  font-size: 18px;
  line-height: 1;
  opacity: .78;
  transition: transform .18s ease;
}
.form-section-header[aria-expanded="false"] .form-section-chevron{
  transform: rotate(-90deg);
}
/* Locked sections use a lock glyph, not a chevron; keep it upright/vertical. */
.form-section--locked-collapsed .form-section-chevron{
  transform: none !important;
}
.form-section-header[aria-expanded="false"]{
  border-bottom-left-radius: inherit;
  border-bottom-right-radius: inherit;
}
.form-section--open .form-section-header{
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.form-section-body{
  padding: 12px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
}
.form-section-body[hidden]{
  display:none !important;
}
.form-section--open .form-section-header{
  border-bottom-color: rgba(255,255,255,0.10);
}
@media (max-width: 780px){
  .form-section-body{
    grid-template-columns: 1fr;
  }
}
.form-control{
  width:100%;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.18);
  color: var(--text);
  padding: 10px 10px;
  outline: none;
  font-size: 14px;
}
.form-control:focus-visible{
  border-color: var(--focus);
  box-shadow: 0 0 0 3px var(--focus-ring), var(--shadow);
}
/* Keep normal-user SN on Card as an active dropdown instead of a greyed field. */
.modal-dd .modal-dd-trigger[disabled],
.modal-dd.add-sn-on-card-dd-disabled .modal-dd-trigger{
  opacity: 1;
  cursor: pointer;
  color: var(--text);
  background: rgba(0,0,0,0.18);
}

/* Keep the normal-user Serial Number autofill field from flashing/highlighting on click. */
.form-control.serial-autofill-locked,
.form-control.serial-autofill-locked:focus,
.form-control.serial-autofill-locked:focus-visible{
  border-color: rgba(255,255,255,0.10) !important;
  box-shadow: none !important;
  outline: none !important;
  cursor: default;
  caret-color: transparent;
  user-select: none;
  -webkit-user-select: none;
}

/* Locked Master-backed autofill fields in Add Card for normal collection users. */
.form-control.add-autofill-locked,
.form-control.add-autofill-locked:focus,
.form-control.add-autofill-locked:focus-visible{
  border-color: rgba(255,255,255,0.10) !important;
  background: rgba(255,255,255,0.055) !important;
  color: var(--muted) !important;
  box-shadow: none !important;
  outline: none !important;
  cursor: default;
  caret-color: transparent;
  user-select: none;
  -webkit-user-select: none;
}
.modal-dd.add-sn-on-card-dd-disabled .modal-dd-trigger,
.modal-dd.add-sn-on-card-dd-disabled .modal-dd-trigger:focus,
.modal-dd.add-sn-on-card-dd-disabled .modal-dd-trigger:focus-visible{
  border-color: rgba(255,255,255,0.10) !important;
  background: rgba(255,255,255,0.055) !important;
  color: var(--muted) !important;
  box-shadow: none !important;
  outline: none !important;
  cursor: not-allowed;
}
.form-control.select{
  background: rgba(0,0,0,0.14);
}
.form-note{
  font-size: 13px;
  color: var(--muted);
  margin: 0 0 10px 0;
  line-height: 1.4;
}
.modal-msg{
  font-size: 13px;
  color: var(--muted);
}
.modal-msg.ok{ color:#9be6b5; }
.modal-msg.err{ color:#ff9aa2; }

.save-progress-wrap{
  min-width: min(320px, 42vw);
  display:grid;
  gap:6px;
}
.save-progress-label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:12px;
  color:var(--muted);
}
.save-progress-label strong{
  color:var(--text);
  font-weight:800;
}
.save-progress-track{
  width:100%;
  height:8px;
  overflow:hidden;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.07);
}
.save-progress-fill{
  width:0%;
  height:100%;
  border-radius:999px;
  background:rgba(154,139,255,.72);
  box-shadow:0 0 18px rgba(154,139,255,.32);
  transition:width .18s ease;
}
.save-progress-fill.is-indeterminate{
  width:38%;
  animation:saveProgressIndeterminate 1s ease-in-out infinite;
}
@keyframes saveProgressIndeterminate{
  0%{ transform:translateX(-110%); }
  100%{ transform:translateX(285%); }
}
@media (max-width:780px){
  .modal-footer{ align-items:stretch; }
  .save-progress-wrap{ min-width:100%; }
}

/* Compact custom dropdowns for Add/Edit Card modals only */
.modal-native-select{
  position:absolute !important;
  opacity:0 !important;
  pointer-events:none !important;
  width:1px !important;
  height:1px !important;
  margin:0 !important;
  padding:0 !important;
}
.modal-dd{
  position:relative;
  width:100%;
}
.modal-dd-trigger{
  width:100%;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.10);
  background:rgba(0,0,0,0.18);
  color:var(--text);
  padding:10px 38px 10px 10px;
  outline:none;
  font-size:14px;
  text-align:left;
  cursor:pointer;
  min-height:42px;
}
.modal-dd-trigger::after{
  content:'▼';
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  font-size:10px;
  opacity:.7;
  pointer-events:none;
}
.modal-dd.open .modal-dd-trigger,
.modal-dd-trigger:focus-visible{
  border-color: var(--focus);
  box-shadow: 0 0 0 3px var(--focus-ring), var(--shadow);
}
.modal-dd-list{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  right:0;
  background:linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
  border:1px solid var(--border);
  border-radius:12px;
  box-shadow:var(--shadow);
  max-height:220px;
  overflow:auto;
  display:none;
  z-index:2600;
}
.modal-dd.open .modal-dd-list{ display:block; }
.modal-dd-option{
  padding:10px 12px;
  font-size:14px;
  cursor:pointer;
}
@media (hover: hover) and (pointer: fine) {
.modal-dd-option:hover{
  background:rgba(255,255,255,.08);
}
}
.modal-dd-option[aria-selected='true']{
  background:rgba(255,255,255,.08);
}
.modal.modal-dd-scroll-lock .modal-body{
  overflow:hidden;
  overscroll-behavior:contain;
}
.modal-dd-list{
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
}
@media (hover: none) and (pointer: coarse){
  .modal.modal-dd-scroll-lock .modal-body{
    overflow:auto;
  }
  .modal-dd-list{
    max-height:min(180px, 34vh);
  }
}


/* Shared dropdown styling for non-modal areas (filters, archive, etc.) */
.uniform-native-select{
  position:absolute !important;
  opacity:0 !important;
  pointer-events:none !important;
  width:1px !important;
  height:1px !important;
  margin:0 !important;
  padding:0 !important;
}
.uniform-dd{
  position:relative;
  width:100%;
}
.uniform-dd-trigger{
  width:100%;
  position:relative;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.10);
  background:rgba(0,0,0,0.18);
  color:var(--text);
  padding:10px 38px 10px 10px;
  outline:none;
  font-size:14px;
  text-align:left;
  cursor:pointer;
  min-height:42px;
}
.uniform-dd-trigger::after{
  content:'▼';
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  font-size:10px;
  opacity:.7;
  pointer-events:none;
}
.uniform-dd.open .uniform-dd-trigger,
.uniform-dd-trigger:focus-visible{
  border-color: var(--focus);
  box-shadow: 0 0 0 3px var(--focus-ring), var(--shadow);
}
.uniform-dd-list{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  right:0;
  background:linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
  border:1px solid var(--border);
  border-radius:12px;
  box-shadow:var(--shadow);
  max-height:220px;
  overflow:auto;
  display:none;
  z-index:2600;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
}
.uniform-dd.open .uniform-dd-list{ display:block; }
.uniform-dd-option{
  padding:10px 12px;
  font-size:14px;
  cursor:pointer;
}
@media (hover: hover) and (pointer: fine) {
.uniform-dd-option:hover{
  background:rgba(255,255,255,.08);
}
}
.uniform-dd-option[aria-selected='true']{
  background:rgba(255,255,255,.08);
}
.archive-series-row .uniform-dd,
.mc-field .uniform-dd{
  width:100%;
}


/* ===== Image upload fields (Add/Edit Card) ===== */
.image-upload-wrap{
  display:grid;
  gap:10px;
}
.image-upload-dropzone{
  border:1px dashed rgba(255,255,255,.22);
  border-radius:14px;
  padding:12px;
  background:rgba(255,255,255,.02);
  display:grid;
  gap:10px;
  text-align:center;
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease;
}
@media (hover: hover) and (pointer: fine) {
.image-upload-dropzone:hover{
  border-color:rgba(255,255,255,.6);
  background:rgba(255,255,255,.05);
}
}
.image-upload-dropzone.is-dragover{
  border-color:rgba(255,255,255,.6);
  background:rgba(255,255,255,.05);
}
.image-upload-help{
  font-size:12px;
  color:var(--muted);
  line-height:1.4;
}
.image-upload-preview-wrap{
  display:none;
  gap:8px;
  justify-items:center;
}
.image-upload-preview-wrap.has-image{ display:grid; }
.image-upload-preview{
  width:100%;
  max-width:220px;
  aspect-ratio:3/4;
  object-fit:contain;
  border-radius:10px;
  background:rgba(0,0,0,.20);
  border:1px solid rgba(255,255,255,.08);
}
.image-upload-path{
  width:100%;
  font-size:11px;
  color:var(--muted);
  overflow-wrap:anywhere;
}
.image-upload-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:center;
}
.image-upload-actions .auth-btn{
  min-width:124px;
}
.image-upload-dropzone.is-locked{
  cursor:not-allowed;
  opacity:.72;
}
@media (hover: hover) and (pointer: fine) {
.image-upload-dropzone.is-locked:hover{
  border-color:rgba(255,255,255,.22);
  background:rgba(255,255,255,.02);
}
}

/* ===== Privacy Modal ===== */
.privacy-user-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.privacy-user-meta{
  min-width:0;
  display:grid;
  gap:4px;
}
.privacy-user-name{
  font-weight:700;
  overflow-wrap:anywhere;
}
.privacy-user-email{
  font-size:12px;
  color:var(--muted);
  overflow-wrap:anywhere;
}
.privacy-switch{
  position:relative;
  display:inline-flex;
  align-items:center;
  width:48px;
  height:28px;
  flex:0 0 auto;
}
.privacy-switch input{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
  margin:0;
}
.privacy-switch-ui{
  width:48px;
  height:28px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.12);
  transition:background .18s ease, border-color .18s ease;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);
}
.privacy-switch-ui::after{
  content:'';
  position:absolute;
  top:3px;
  left:3px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.35);
  transition:transform .18s ease;
}
.privacy-switch input:checked + .privacy-switch-ui{
  background:rgba(154,139,255,.34);
  border-color:rgba(154,139,255,.65);
}
.privacy-switch input:checked + .privacy-switch-ui::after{
  transform:translateX(20px);
}
.privacy-switch input:disabled + .privacy-switch-ui{
  opacity:.6;
}
.privacy-user-state{
  font-size:11px;
  font-weight:700;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.06em;
}

.privacy-toggle-stack{
  display:flex;
  align-items:center;
  gap:12px;
  flex:0 0 auto;
}
.privacy-toggle-group{
  display:grid;
  gap:6px;
  justify-items:center;
}
.privacy-toggle-label{
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
  white-space:nowrap;
}
.privacy-switch.is-secondary .privacy-switch-ui{
  background:rgba(255,255,255,.08);
}
.privacy-switch.is-secondary input:checked + .privacy-switch-ui{
  background:rgba(87,168,255,.28);
  border-color:rgba(87,168,255,.55);
}

/* ===== Edit Card Modal ===== */
.danger-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,90,90,0.35);
  background: rgba(255, 90, 90, 0.12);
  color: #ffd6d6;
  cursor:pointer;
}
@media (hover: hover) and (pointer: fine) {
.danger-btn:hover{ background: rgba(255, 90, 90, 0.18); border-color: rgba(255,90,90,0.55); }
}
.danger-btn:disabled{ opacity:.45; cursor:not-allowed; }

/* ===== Add / Edit Card action layout =====
   Keep the action hierarchy in one shared grid model. Edit uses Remove + Save
   on the first row and a full-width Cancel on the second row. Add has no
   existing entry to remove, so Save remains full-width above Cancel. */
#addCardModal .modal-footer,
#editCardModal .modal-footer{
  flex-direction:column;
  align-items:stretch;
}
#addCardModal .card-modal-actions,
#editCardModal .card-modal-actions{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:8px;
}
#addCardModal .card-modal-actions{
  grid-template-areas:
    "save save"
    "cancel cancel";
}
#editCardModal .card-modal-actions{
  grid-template-areas:
    "remove save"
    "cancel cancel";
}
#addCardModal .card-modal-actions > button,
#editCardModal .card-modal-actions > button{
  width:100%;
  min-width:0;
}
#addCardModal .card-modal-save,
#editCardModal .card-modal-save{ grid-area:save; }
#editCardModal .card-modal-remove{ grid-area:remove; }
#addCardModal .card-modal-cancel,
#editCardModal .card-modal-cancel{ grid-area:cancel; }

/* Owner divider in thumbnail (alt) window */
.alt-owner-label{
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.75;
  /* allow wrapping instead of truncation */
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  max-width:100%;
  word-break:break-word;
}
.alt-owner-rule{
  height:1px;
  background:rgba(255,255,255,.16);
  flex:1 1 120px;
  min-width:60px;
}

/* ===== Pro Tip Slider (replaces single protip-icon.png image) ===== */
.protip-slider{
  position: relative;
  width: 100%;
  margin: 0 auto;
  max-width: 720px; /* keeps it from getting huge on desktop; image sizing still controlled by .protip-img */
}
.protip-viewport{
  overflow: hidden;
  border-radius: 12px;
}
.protip-track{
  display: flex;
  gap: 0;
  transform: translateX(0%);
  transition: transform 260ms ease;
  will-change: transform;
}
.protip-slide{
  flex: 0 0 100%;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.protip-slide:focus-visible{
  outline: 2px solid rgba(255,255,255,.35);
  outline-offset: 3px;
  border-radius: 12px;
}
.protip-slide img{
  display:block;
}

/* Controls */
.protip-controls{
  margin-top: 10px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
}
.protip-navbtn{
  appearance:none;
  border:1px solid var(--border);
  background: rgba(255,255,255,0.03);
  color: var(--text);
  border-radius: 999px;
  padding: 8px 10px;
  cursor: pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
@media (hover: hover) and (pointer: fine) {
.protip-navbtn:hover{ background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.22); }
}
.protip-navbtn:active{ transform: scale(0.98); }

.protip-dots{
  display:flex;
  gap: 8px;
  align-items:center;
  justify-content:center;
}
.protip-dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.22);
  background: rgba(255,255,255,0.06);
  cursor: pointer;
  padding: 0;
}
.protip-dot[aria-current="true"]{
  background: rgba(255,255,255,0.55);
  border-color: rgba(255,255,255,0.55);
}




/* ===== Random Card of the Day ===== */
.random-card-day-wrap{
  width: 100%;
  max-width: 720px;
  margin: 22px auto 0;
  text-align: left;
}
.random-card-day-btn{
  width: 100%;
  display: grid;
  grid-template-columns: minmax(110px, 150px) 1fr;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.04);
  color: var(--text);
  cursor: pointer;
  box-shadow: var(--shadow);
  text-align: left;
}
@media (hover: hover) and (pointer: fine) {
.random-card-day-btn:hover{
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.06);
}
}
.random-card-day-btn:focus-visible{
  outline: 2px solid rgba(255,255,255,.35);
  outline-offset: 3px;
}
.random-card-day-media{
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}
.random-card-day-media img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
@media (min-width: 781px){
  /* Desktop Card of the Day stays within the primary Browse List -> Random Card span.
     JavaScript below refines this to the live button edges for member/guest layouts. */
  .random-card-day-wrap{
    max-width: 675px;
  }
  .random-card-day-btn.has-dual-media{
    grid-template-columns: minmax(110px, 150px) minmax(0, 1fr) minmax(110px, 150px);
    grid-template-areas: "cut copy comic";
  }
  .random-card-day-btn.has-dual-media .random-card-day-media.is-dual{
    display: contents;
  }
  .random-card-day-btn.has-dual-media .random-card-day-cut,
  .random-card-day-btn.has-dual-media .random-card-day-comic{
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 4;
    object-fit: contain;
    display: block;
    border-radius: 12px;
    background: rgba(255,255,255,.03);
  }
  .random-card-day-btn.has-dual-media .random-card-day-cut{
    grid-area: cut;
    border: 0;
    outline: 0;
    box-shadow: none;
    background: transparent;
  }
  .random-card-day-btn.has-dual-media .random-card-day-comic{
    grid-area: comic;
    border: 0;
    background: transparent;
  }
  .random-card-day-media.is-comic-only{
    border: 0;
    outline: 0;
    box-shadow: none;
    background: transparent;
    padding: 0;
  }
  .random-card-day-comic{
    border: 0;
    outline: 0;
    box-shadow: none;
    background: transparent;
  }
  .random-card-day-btn.has-dual-media .random-card-day-copy{
    grid-area: copy;
    text-align: center;
    justify-items: center;
    align-content: center;
  }
  .random-card-day-btn.has-dual-media .random-card-day-kicker{
    justify-content: center;
  }

  /* Logged-out desktop Card of the Day mirrors the member three-column layout. */
  .random-card-day-btn.is-guest-viewer.has-dual-media{
    grid-template-columns: minmax(110px, 150px) minmax(0, 1fr) minmax(110px, 150px);
    grid-template-areas: "cut copy comic";
  }
  .random-card-day-btn.is-guest-viewer.has-dual-media .random-card-day-copy{
    grid-area: copy;
    width: 100%;
    place-self: center;
    text-align: center;
    justify-items: center;
    align-content: center;
  }
  .random-card-day-btn.is-guest-viewer.has-dual-media .random-card-day-comic{
    grid-area: comic;
    border: 0;
    box-shadow: none;
    background: transparent;
  }
  .random-card-day-btn.is-guest-viewer:not(.has-dual-media){
    grid-template-columns: minmax(110px, 150px) minmax(0, 1fr) minmax(110px, 150px);
    grid-template-areas: ". copy comic";
  }
  .random-card-day-btn.is-guest-viewer:not(.has-dual-media) .random-card-day-media{
    grid-area: comic;
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  .random-card-day-btn.is-guest-viewer:not(.has-dual-media) .random-card-day-copy{
    grid-area: copy;
    width: 100%;
    place-self: center;
    text-align: center;
    justify-items: center;
    align-content: center;
  }
  .random-card-day-btn.is-guest-viewer:not(.has-dual-media) .random-card-day-kicker{
    justify-content: center;
  }
}
.random-card-day-copy{
  min-width: 0;
  display: grid;
  gap: 7px;
}
.random-card-day-kicker{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
}
.random-card-day-pill{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid rgba(154, 139, 255, 0.45);
  background: rgba(154, 139, 255, 0.16);
  color: #fff;
  letter-spacing: .12em;
}
.random-card-day-title{
  margin: 0;
  font-size: clamp(18px, 2.7vw, 24px);
  line-height: 1.2;
}
.random-card-day-meta,
.random-card-day-caption{
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted);
}
.random-card-day-empty{
  padding: 16px;
  border-radius: 16px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.03);
  color: var(--muted);
  font-size: 13px;
  text-align: center;
}
@media (max-width: 780px){
  .random-card-day-wrap{
    min-height: 430px;
  }
  .random-card-day-btn{
    grid-template-columns: 1fr;
    min-height: 410px;
  }
  .random-card-day-media{
    max-width: 200px;
    min-height: 260px;
    margin: 0 auto;
  }
  .random-card-day-media img{
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 4;
    object-fit: contain;
  }

  /* Mobile Random Card of the Day:
     when both image + imagecomic exist, size the PAIR to the same visual width
     as the home slider above instead of forcing both images into the old
     200x260 media placeholder. Shared by logged-in and logged-out viewers. */
  /* Keep the dual-image row close to the copy below on mobile.
     Base grid gap is 14px; 6px is about 60% less vertical space. */
  .random-card-day-wrap:has(> .random-card-day-btn.has-dual-media){
    min-height: 0;
  }
  .random-card-day-btn.has-dual-media{
    /* Dual-image mobile cards should size to their actual content. Keeping the
       old 410px minimum height leaves a large empty band beneath the slider. */
    min-height: 0;
    grid-template-rows: max-content max-content;
    align-content: start;
    /* Visible breathing room above the Card of the Day copy block. */
    row-gap: 12px;
  }

  .random-card-day-btn.has-dual-media .random-card-day-media.is-dual{
    box-sizing: border-box;
    width: min(85vw, 100%);
    max-width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: auto;
    margin: 0 auto;
    padding: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 10px;
    overflow: visible;
    border: 0;
    background: transparent;
    background-color: transparent !important;
    box-shadow: none;
  }
  .random-card-day-btn.has-dual-media .random-card-day-media.is-dual > img,
  .random-card-day-btn.has-dual-media .random-card-day-media.is-dual > img.is-mobile-primary,
  .random-card-day-btn.has-dual-media .random-card-day-media.is-dual > img:not(.is-mobile-primary){
    box-sizing: border-box;
    display: block;
    visibility: visible;
    opacity: 1;
    position: static;
    flex: 1 1 0;
    width: calc((100% - 10px) / 2);
    max-width: calc((100% - 10px) / 2);
    min-width: 0;
    height: auto;
    max-height: none;
    min-height: 0;
    aspect-ratio: 3 / 4;
    object-fit: contain;
    margin: 0;
    padding: 0;
    transform: none;
    background: transparent;
  }
  /* Requested mobile order: image/cut left, imagecomic/cover right. */
  .random-card-day-btn.has-dual-media .random-card-day-media.is-dual > .random-card-day-cut{
    order: 1;
  }
  .random-card-day-btn.has-dual-media .random-card-day-media.is-dual > .random-card-day-comic{
    order: 2;
  }

  .random-card-day-copy{
    text-align: center;
  }
  .random-card-day-kicker{
    justify-content: center;
  }
}

/* ===== Pro Tip Popup ===== */
.protip-popup-overlay{
  position: fixed;
  inset: 0;
  z-index: 2400;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(0,0,0,0.68);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.protip-popup-overlay.open{ display:flex; }
.protip-popup{
  width: min(920px, 100%);
  max-height: min(86vh, 860px);
  max-height: min(86dvh, 860px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(21,23,26,.96) 0%, rgba(16,17,20,.98) 100%);
  box-shadow: 0 24px 60px rgba(0,0,0,.5);
}
.protip-popup-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
}
.protip-popup-title-wrap{ display:grid; gap:4px; min-width:0; }
.protip-popup-kicker{
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 800;
}
.protip-popup-title{
  margin:0;
  font-size: clamp(20px, 3vw, 30px);
  line-height: 1.15;
}
.protip-popup-close{
  flex: 0 0 auto;
}
.protip-popup-body{
  overflow:auto;
  padding: 18px 16px 20px;
  display:grid;
  gap: 18px;
  -webkit-overflow-scrolling: touch;
}
.protip-popup-copy{
  display:grid;
  gap: 12px;
  color: var(--text);
  line-height: 1.65;
  font-size: 14px;
}
.protip-popup-copy p{ margin:0; }
.protip-popup-copy ul{
  margin:0;
  padding-left: 18px;
  color: var(--muted);
}
.protip-popup-copy li + li{ margin-top: 8px; }
.protip-popup-gallery{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.protip-popup-figure{
  margin:0;
  display:grid;
  gap: 8px;
  padding: 10px;
  border-radius: 16px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.03);
}
.protip-popup-figure img{
  width: 100%;
  height: auto;
  display:block;
  border-radius: 12px;
  background: rgba(255,255,255,.04);
}
.protip-popup-figure figcaption{
  font-size: 12px;
  color: var(--muted);
  line-height: 1.45;
}
@media (max-width: 780px){
  .protip-popup-overlay{ padding: 12px; }
  .protip-popup{ max-height: min(90vh, 900px); max-height: min(90dvh, 900px); }
  .protip-popup-body{ padding: 14px 12px 16px; }
  .protip-popup-gallery{ grid-template-columns: 1fr; }
}


/* ===== Comic Cut Stats dashboard popup ===== */
.ccs-dashboard{
  display:grid;
  gap:16px;
}
.ccs-dashboard-hero{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:14px;
  align-items:stretch;
  padding:15px;
  border:1px solid rgba(154,139,255,.34);
  background:
    radial-gradient(420px 180px at 10% 0%, rgba(154,139,255,.24), transparent 65%),
    linear-gradient(180deg, rgba(154,139,255,.13), rgba(255,255,255,.025));
  box-shadow:0 18px 44px rgba(0,0,0,.28);
}
.ccs-dashboard-hero-copy{
  display:grid;
  align-content:center;
  gap:8px;
  min-width:0;
}
.ccs-dashboard-eyebrow{
  color:var(--muted);
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.ccs-dashboard-hero-title{
  margin:0;
  font-size:clamp(22px, 4vw, 40px);
  line-height:1.02;
  font-weight:900;
}
.ccs-dashboard-hero-note{
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
}
.ccs-dashboard-scorecard{
  display:grid;
  place-items:center;
  text-align:center;
  padding:16px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.18);
}
.ccs-dashboard-scorecard strong{
  display:block;
  font-size:clamp(34px, 7vw, 62px);
  line-height:1;
}
.ccs-dashboard-scorecard span{
  display:block;
  margin-top:6px;
  color:var(--muted);
  font-size:11px;
  font-weight:900;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.ccs-stat-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.ccs-stat-card{
  min-width:0;
  display:grid;
  gap:6px;
  padding:13px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.035);
}
.ccs-stat-card label{
  display:flex;
  align-items:center;
  gap:7px;
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ccs-stat-card label .material-symbols-outlined{
  font-size:17px;
  color:var(--brand);
}
.ccs-stat-card strong{
  font-size:22px;
  line-height:1.1;
  overflow-wrap:anywhere;
}
.ccs-stat-card span{
  color:var(--muted);
  font-size:11px;
  line-height:1.35;
}
.ccs-dashboard-section{
  display:grid;
  gap:10px;
}
.ccs-dashboard-section-title{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0;
  color:var(--text);
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ccs-dashboard-section-title .material-symbols-outlined{
  font-size:19px;
  color:var(--brand);
}
.ccs-list-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.ccs-list-card{
  min-width:0;
  display:grid;
  gap:10px;
  padding:13px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
}
.ccs-list-card.is-wide{
  grid-column:1 / -1;
}
.ccs-list-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:var(--text);
  font-size:12px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.ccs-list-heading small{
  color:var(--muted);
  font-size:10px;
  font-weight:800;
}
.ccs-rank-list{
  display:grid;
  gap:8px;
}
.ccs-rank-row{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
}
.ccs-rank-num{
  width:28px;
  height:28px;
  display:inline-grid;
  place-items:center;
  border:1px solid rgba(154,139,255,.38);
  background:rgba(154,139,255,.12);
  font-size:11px;
  font-weight:900;
}
.ccs-rank-name{
  min-width:0;
  display:grid;
  gap:2px;
}
.ccs-rank-name strong{
  font-size:13px;
  line-height:1.25;
  overflow-wrap:anywhere;
}
.ccs-rank-name span{
  color:var(--muted);
  font-size:11px;
  overflow-wrap:anywhere;
}
.ccs-rank-value{
  min-width:48px;
  text-align:right;
  font-size:13px;
  font-weight:900;
}
.ccs-rank-row--rare{
  grid-template-columns:auto minmax(0,1fr) minmax(62px,auto);
}
.ccs-rank-row--rare .ccs-rank-value{
  min-width:62px;
  font-variant-numeric:tabular-nums;
}
.ccs-rank-list--rare .ccs-rank-name span{
  display:block;
  max-width:100%;
}
.ccs-bar{
  grid-column:2 / 4;
  height:7px;
  background:rgba(255,255,255,.08);
  overflow:hidden;
}
.ccs-bar-fill{
  height:100%;
  width:0;
  background:rgba(154,139,255,.68);
  box-shadow:0 0 20px rgba(154,139,255,.25);
}
.ccs-pill-row{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.ccs-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:5px 9px;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(0,0,0,.18);
  color:rgba(255,255,255,.84);
  font-size:10px;
  font-weight:900;
  letter-spacing:.07em;
  line-height:1.1;
  text-transform:uppercase;
}
.ccs-pill.purple{ border-color:rgba(154,139,255,.38); background:rgba(154,139,255,.12); }
.ccs-pill.green{ border-color:rgba(80,220,125,.34); background:rgba(80,220,125,.10); }
.ccs-pill.gold{ border-color:rgba(255,214,0,.35); background:rgba(255,214,0,.10); }
.ccs-pill.red{ border-color:rgba(255,70,70,.35); background:rgba(255,70,70,.10); }
.ccs-empty{
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
  padding:12px;
  border:1px dashed var(--border);
  background:rgba(255,255,255,.02);
}
@media (max-width:900px){
  .ccs-stat-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ccs-dashboard-hero{ grid-template-columns:1fr; }
}
@media (max-width:780px){
  .ccs-list-grid{ grid-template-columns:1fr; }
  .ccs-list-card.is-wide{ grid-column:auto; }
}
@media (max-width:480px){
  .ccs-stat-grid{ grid-template-columns:1fr; }
  .ccs-rank-row{ grid-template-columns:auto minmax(0,1fr) auto; gap:8px; }
  .ccs-bar{ grid-column:1 / -1; }
}


/* Keep the slider image sizing exactly as your existing protip image rules */
#result .empty .protip-img{ max-width: 60%; }
@media (max-width: 780px){
  #result .empty .protip-img{ max-width: 90%; margin: 0 auto 4px; }
}


.search-separator {
  color: var(--muted);
  font-weight: 400;
  opacity: 0.6;
  padding: 0 6px;
  user-select: none;
}


/* Icon-only filter button */

/* Make filter icon button match sort button style */
.mc-filters-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:34px;
  width:34px;
  border-radius:8px;
  border:1px solid var(--border);
  background:var(--panel);
  cursor:pointer;
}
@media (hover: hover) and (pointer: fine) {
.mc-filters-toggle:hover{
  background:var(--panel-2);
}
}
.mc-filters-toggle .mc-filter-ic{
  font-size:20px;
}

.mc-filters-toggle .mc-filters-left{display:none !important;}
.mc-filters-toggle{padding:6px 8px;}


/* Active/open state for filter + sort toolbar buttons */
.mc-sort-icon-btn[data-open="true"],
.mc-filters-toggle[data-open="true"],
.mc-sort-icon-btn[aria-expanded="true"],
.mc-filters-toggle[aria-expanded="true"]{
  background: rgba(154, 139, 255, 0.18) !important;
  border-color: rgba(154, 139, 255, 0.55) !important;
  box-shadow: 0 0 0 1px rgba(154, 139, 255, 0.18) inset;
}
.mc-sort-icon-btn[data-open="true"] .mc-sort-icon,
.mc-filters-toggle[data-open="true"] .mc-filter-ic,
.mc-sort-icon-btn[aria-expanded="true"] .mc-sort-icon,
.mc-filters-toggle[aria-expanded="true"] .mc-filter-ic{
  color: var(--brand);
}


/* Center specific columns on desktop */
@media (min-width: 768px){
  .comic-cuts-head div:nth-child(4),
  .comic-cuts-head div:nth-child(5),
  .comic-cuts-head div:nth-child(6),
  .comic-cuts-head div:nth-child(7),
  .comic-cuts-row div:nth-child(4),
  .comic-cuts-row div:nth-child(5),
  .comic-cuts-row div:nth-child(6),
  .comic-cuts-row div:nth-child(7){
    text-align:center;
    justify-self:center;
  }
}


/* === HOME ACTIONS FALLBACK 20260814 v6 === */
/* Homepage browse/action buttons.
   Match the exact mobile full-detail Previous / Checklist / Next action style,
   but keep four equal actions on the Home page at every viewport size. */
.home-browse-actions{
  box-sizing:border-box !important;
  width:min(680px, 100%) !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:32px auto 8px !important;
  padding:0 2px !important;
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  align-items:start !important;
  justify-items:stretch !important;
  column-gap:4px !important;
  row-gap:0 !important;
  overflow:visible !important;
}

html body .home-browse-actions > .home-browse-action-btn{
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:7px !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:auto !important;
  min-height:86px !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 1px !important;
  border:0 !important;
  border-bottom:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--text) !important;
  box-shadow:none !important;
  opacity:1 !important;
  overflow:visible !important;
  text-align:center !important;
  text-decoration:none !important;
  white-space:normal !important;
  cursor:pointer !important;
  transform:none !important;
  transition:none !important;
  font:inherit !important;
  outline:none !important;
}

html body .home-browse-actions .home-browse-action-circle,
html body .home-browse-actions .ccc-main-action-circle{
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 56px !important;
  width:56px !important;
  height:56px !important;
  min-width:56px !important;
  min-height:56px !important;
  max-width:56px !important;
  max-height:56px !important;
  margin:0 !important;
  padding:0 !important;
  border:1px solid rgba(255,255,255,.16) !important;
  border-radius:50% !important;
  background:rgba(255,255,255,.075) !important;
  color:var(--text) !important;
  box-shadow:none !important;
  overflow:hidden !important;
  transform:none !important;
  transition:border-color .15s ease, background .15s ease !important;
}

html body .home-browse-actions .home-browse-action-circle .material-symbols-outlined,
html body .home-browse-actions .ccc-main-action-circle .material-symbols-outlined{
  display:block !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  color:inherit !important;
  font-size:27px !important;
  line-height:1 !important;
}

html body .home-browse-actions .home-browse-action-label,
html body .home-browse-actions .ccc-main-action-label{
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:0 !important;
  width:100% !important;
  min-width:0 !important;
  min-height:2.2em !important;
  margin:0 !important;
  padding:0 !important;
  color:var(--text) !important;
  font-size:11px !important;
  font-weight:650 !important;
  line-height:1.1 !important;
  letter-spacing:0 !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}

html body .home-browse-actions .home-browse-action-label > span,
html body .home-browse-actions .ccc-main-action-label > span{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}

@media (hover: hover) and (pointer: fine) {

html body .home-browse-actions > .home-browse-action-btn:hover:not(:disabled){
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:none !important;
  transform:none !important;
}
}

html body .home-browse-actions > .home-browse-action-btn:focus-visible,
html body .home-browse-actions > .home-browse-action-btn:active{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:none !important;
  transform:none !important;
}

html body .home-browse-actions > .home-browse-action-btn:focus-visible .home-browse-action-circle,
html body .home-browse-actions > .home-browse-action-btn:active .home-browse-action-circle{
  border-color:rgba(255,255,255,.5) !important;
  background:rgba(255,255,255,.12) !important;
}
@media (min-width:781px){
  @media (hover: hover) and (pointer: fine) {
  html body .home-browse-actions > .home-browse-action-btn:not(:disabled):not([aria-disabled="true"]):not(.is-home-disabled) .home-browse-action-circle:hover{
    border-color:#fff !important;
    background:rgba(255,255,255,.12) !important;
  }
    }
}

/* Logged-out Price Guide: same action geometry, muted exactly at the icon/label level. */
html body .home-browse-actions > .home-browse-action-btn:disabled,
html body .home-browse-actions > .home-browse-action-btn[aria-disabled="true"],
html body .home-browse-actions > .home-browse-action-btn.is-home-disabled{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  transform:none !important;
  opacity:1 !important;
  filter:none !important;
  cursor:default !important;
  pointer-events:none !important;
}
html body .home-browse-actions > .home-browse-action-btn:disabled .home-browse-action-circle,
html body .home-browse-actions > .home-browse-action-btn[aria-disabled="true"] .home-browse-action-circle,
html body .home-browse-actions > .home-browse-action-btn.is-home-disabled .home-browse-action-circle{
  border-color:rgba(180,184,196,.16) !important;
  background:rgba(112,116,128,.14) !important;
  color:rgba(188,192,204,.42) !important;
  filter:grayscale(1) !important;
}
html body .home-browse-actions > .home-browse-action-btn:disabled .home-browse-action-label,
html body .home-browse-actions > .home-browse-action-btn[aria-disabled="true"] .home-browse-action-label,
html body .home-browse-actions > .home-browse-action-btn.is-home-disabled .home-browse-action-label,
html body .home-browse-actions > .home-browse-action-btn:disabled .material-symbols-outlined,
html body .home-browse-actions > .home-browse-action-btn[aria-disabled="true"] .material-symbols-outlined,
html body .home-browse-actions > .home-browse-action-btn.is-home-disabled .material-symbols-outlined{
  color:rgba(188,192,204,.42) !important;
  opacity:1 !important;
}

/* Browse by Comic Book: reuse the exact Checklist -> Comic Books mini grid.
   Each series uses a normal .mini-row cover tile, with the title/count below it. */
.ccc-comic-book-alpha-section{
  margin:0 0 26px;
}
.ccc-comic-book-alpha-heading{
  margin:0 0 10px;
  padding:0 2px 7px;
  border-bottom:1px solid var(--border);
  color:var(--text);
  font-size:18px;
  font-weight:800;
  line-height:1;
}
.ccc-comic-book-browser-page .ccc-comic-book-series-grid{
  /* .mini-results owns the actual responsive grid dimensions. */
  margin-top:0;
  align-items:start;
}
.ccc-comic-book-series-item{
  min-width:0;
  width:100%;
}
a.ccc-comic-book-series.mini-row{
  display:grid;
  width:100%;
  aspect-ratio:3 / 4;
  margin:0;
  color:inherit;
  text-decoration:none;
}
a.ccc-comic-book-series.mini-row .mini-tile-img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.ccc-comic-book-series-placeholder{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.04);
  color:var(--muted);
}
.ccc-comic-book-series-placeholder .material-symbols-outlined{
  font-size:30px;
  opacity:.75;
}
.ccc-comic-book-series-name{
  margin-top:6px;
  padding:0 2px;
  min-height:2.5em;
  color:var(--text);
  font-size:11px;
  font-weight:600;
  line-height:1.25;
  text-align:center;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
.ccc-comic-book-series-meta{
  margin-top:3px;
  color:var(--muted);
  font-size:10px;
  line-height:1.2;
  text-align:center;
}

@media (max-width:520px){
  .home-browse-actions{
    width:100% !important;
  }
  .ccc-comic-book-alpha-section{ margin-bottom:22px; }
  .ccc-comic-book-alpha-heading{ font-size:16px; margin-bottom:9px; }
  .ccc-comic-book-series-name{
    margin-top:5px;
    font-size:10px;
    line-height:1.2;
  }
  .ccc-comic-book-series-meta{
    margin-top:2px;
    font-size:9px;
  }
}


/* Mobile Browse by Comic Book intentionally inherits the exact Checklist
   .mini-results / .mini-row sizing. Do not override columns, gap, radius,
   aspect ratio, or image dimensions here. */
@media (max-width:780px), (hover:none) and (pointer:coarse){
  .ccc-comic-book-browser-page .ccc-comic-book-series-grid > .ccc-comic-book-series.mini-row{
    min-width:0;
  }
}


/* Mobile Browse by Comic Book: desktop grouping/behavior, fixed 3 issue covers per row. */
@media (max-width:780px){
  .ccc-comic-book-browser-page .ccc-mobile-comic-series-block{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
  }
  .ccc-comic-book-browser-page .ccc-mobile-comic-series-title{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }
  .ccc-comic-book-browser-page .ccc-mobile-comic-issue-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    grid-auto-flow:row !important;
    grid-auto-columns:auto !important;
    gap:8px !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:visible !important;
  }
  .ccc-comic-book-browser-page .ccc-mobile-comic-issue-grid > .ccc-mobile-comic-issue-tile{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    border-radius:8px !important;
  }
  .ccc-comic-book-browser-page .ccc-mobile-comic-issue-tile > img{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    aspect-ratio:3/4 !important;
    object-fit:cover !important;
    margin:0 !important;
  }
}

/* Left flyout: permanently remove retired shortcut controls. */
#leftFlyout #leftDatabaseBtn,
#leftFlyout #leftFirstAppearanceBtn,
#leftFlyout #leftErrorBtn,
#leftFlyout #leftReprintBtn,
#leftFlyout .left-protip-shortcuts[aria-label="Comic Cut quick lists"] {
  display:none !important;
}

/* === SOURCE: 002-inline-style-2.css === */
/* Disable progress bar hover effects when header is collapsed */
.collapsed .progress-bar:hover,
.collapsed .progress:hover {
  transform: none !important;
  filter: none !important;
  box-shadow: none !important;
  cursor: default !important;
}

/* === SOURCE: 003-inline-style-3.css === */
/* Desktop hover: neutralize hover highlight when My Collection header is collapsed */
.mc-profile-card[data-expanded="false"] .mc-progress-btn:hover .mc-progress-track{
  border-color: rgba(255,255,255,0.14) !important;
}
.mc-profile-card[data-expanded="false"] .mc-progress-btn:hover .mc-progress-pct{
  color: rgba(255,255,255,0.75) !important;
}
.mc-profile-card[data-expanded="false"] .mc-progress-btn:hover .mc-progress-edit{
  opacity: 0 !important;
  transform: translateX(6px) !important; /* match resting state */
}

/* === SOURCE: 004-inline-style-4.css === */
/* Desktop filter box width fix */
@media (min-width: 900px){
  .mc-filters-panel{
    width:min(400px, calc(100vw - 32px));
    max-width:none;
  }
  .mc-filters-inner{
    display:flex;
    justify-content:center;
  }
}

/* Mobile fix: center SN and Card # columns */
@media (max-width:780px){
  .comic-cuts-head div:nth-child(2),
  .comic-cuts-head div:nth-child(3),
  .comic-cuts-row div:nth-child(2),
  .comic-cuts-row div:nth-child(3){
    text-align:center;
    justify-self:center;
  }
}

@media (max-width:780px){

  .comic-cuts-head{
    font-size:8px;
    line-height:1.1;
  }

  .comic-cuts-head div{
    white-space:normal;
    word-break:break-word;
    text-align:center;
  }

  .label-reprint::after{ content:"Repr."; }
  .label-error::after{ content:"Err."; }

  .label-reprint,
  .label-error{
    font-size:0;
  }

  .label-reprint::after,
  .label-error::after{
    font-size:8px;
  }
}

/* === SOURCE: 005-mobile-mini-overlay-fix.css === */
@media (max-width:520px){
  .mini-popover-cardnum{ font-size:9px !important; }
  .mini-popover-serial{ font-size:9px !important; }
  .mini-popover-view{ font-size:9px !important; }
  .mc-issue-overlay-title{ font-size:9px !important; }
}

/* === SOURCE: 006-mobile-mini-overlay-polish.css === */
@media (max-width:520px){
  .mini-popover{
    padding: 8px !important;
  }

  .mini-popover-card{
    padding: 8px 9px 9px !important;
    gap: 4px !important;
    border-radius: 13px !important;
    max-width: 220px !important;
  }

  .mini-popover-cardnum{
    font-size: 11px !important;
    line-height: 1.1 !important;
    margin-bottom: 1px !important;
  }

  .mini-popover-divider{
    margin: 1px 0 !important;
  }

  .mini-popover-serial{
    font-size: 11px !important;
    line-height: 1.1 !important;
    margin-top: 1px !important;
    margin-bottom: 7px !important;
  }

  .mini-popover-actions{
    gap: 7px !important;
  }

  .mini-popover-view{
    font-size: 11px !important;
    min-height: 34px !important;
    padding: 5px 8px !important;
    border-radius: 11px !important;
  }

  .mini-popover-view .material-symbols-outlined{
    font-size: 15px !important;
  }

  .mini-popover-hunt .material-symbols-outlined{
    font-size: 18px !important;
  }

  .mc-issue-overlay{
    padding: 8px !important;
  }

  .mc-issue-overlay-panel{
    padding: 8px 10px 10px !important;
    gap: 5px !important;
    border-radius: 13px !important;
    max-width: 220px !important;
  }

  .mc-issue-overlay-title{
    font-size: 11px !important;
    line-height: 1.1 !important;
  }

  .mc-issue-overlay-count{
    font-size: 11px !important;
    line-height: 1.1 !important;
  }

  .mc-issue-overlay-footer{
    gap: 5px !important;
  }

  .mc-issue-overlay-btn{
    height: 34px !important;
    padding: 4px 8px !important;
    border-radius: 11px !important;
  }

  .mc-issue-overlay-btn .material-symbols-outlined{
    font-size: 15px !important;
  }

  .mini-results{
    gap: 6px !important;
  }

  .mini-row{
    border-radius: 9px !important;
  }
}

/* === SOURCE: 007-inline-style-7.css === */
/* Force remove curved boxes + shadows */
.gallery-item, .card, .gallery-card, .item {
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}
img {
    border-radius: 0 !important;
}

/* === SOURCE: 008-mc-gallery-square-patch.css === */
/* Remove rounded/curved gallery card shell */
.mc-gallery-viewport{
  border-radius: 0 !important;
}
.mc-gallery-viewport::before{
  border-radius: 0 !important;
}
.mc-gallery-card,
.mc-gallery-slide.near .mc-gallery-card,
.mc-gallery-slide.active .mc-gallery-card{
  border-radius: 0 !important;
}
.mc-gallery-card::before{
  border-radius: 0 !important;
}
.mc-gallery-card::after{
  border-radius: 0 !important;
}
.mc-gallery-card img{
  border-radius: 0 !important;
}

/* === SOURCE: 009-mc-gallery-mobile-touch-fix.css === */
/* Stable mobile gallery without trapping vertical page scroll */
@media (max-width: 900px){
  .mc-gallery-viewport{
    touch-action: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-x: contain !important;
    overscroll-behavior-y: auto !important;
    scroll-snap-type: x proximity !important;
  }
  .mc-gallery-track{
    transition: none !important;
    transform: none !important;
  }
  .mc-gallery-slide{
    flex: 0 0 82% !important;
    width: 82% !important;
  }
  .mc-gallery-slide.near .mc-gallery-card,
  .mc-gallery-slide.active .mc-gallery-card{
    transform: none !important;
  }
}

/* === SOURCE: 010-for-you-feature-styles.css === */
/* ===== For You recommendations ===== */
.for-you-row{
  width:100%;
  max-width:720px;
  margin:8px auto 2px;
  display:flex;
  justify-content:flex-end;
  padding-right:0;
}
.for-you-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:38px;
  padding:9px 14px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  color:var(--text);
  cursor:pointer;
  font-size:13px;
  font-weight:800;
  letter-spacing:.02em;
  box-shadow:0 10px 24px rgba(0,0,0,.22);
  transition:border-color .18s ease, background .18s ease, transform .18s ease, opacity .18s ease;
}
.for-you-btn:hover{
  border-color:rgba(154,139,255,.58);
  background:rgba(154,139,255,.16);
  transform:translateY(-1px);
}
.for-you-btn[aria-pressed="true"],
.for-you-btn.is-active{
  border-color:rgba(154,139,255,.72);
  background:rgba(154,139,255,.22);
}
.for-you-btn .material-symbols-outlined{ font-size:19px; }

.for-you-wrap{
  width:100%;
  display:grid;
  gap:14px;
  position:relative;
}
.for-you-head{
  width:100%;
  max-width:900px;
  margin:0 auto;
  display:grid;
  gap:5px;
  text-align:center;
}
.for-you-title{
  margin:0;
  font-size:clamp(20px, 3vw, 30px);
  line-height:1.15;
}
.for-you-copy{
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}
.for-you-grid-wrap{
  width:100%;
  max-width:1180px;
  margin:0 auto;
  position:relative;
}
.for-you-grid{
  width:100%;
  display:grid;
  grid-template-columns:repeat(9, minmax(0, 1fr));
  gap:8px;
  transition:filter .2s ease, opacity .2s ease, transform .2s ease;
}
.for-you-grid.is-blurred{
  filter:blur(8px) saturate(.86);
  opacity:.46;
  pointer-events:none;
  transform:scale(.992);
}
.for-you-card{
  position:relative;
  width:100%;
  aspect-ratio:3/4;
  overflow:hidden;
  border:1px solid var(--border);
  background:rgba(255,255,255,.035);
  cursor:pointer;
  padding:0;
  color:var(--text);
  display:grid;
  place-items:center;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}
.for-you-card:hover{
  border-color:rgba(255,255,255,.34);
  background:rgba(255,255,255,.07);
  transform:translateY(-1px);
}
.for-you-card:focus-visible{
  outline:2px solid rgba(255,255,255,.35);
  outline-offset:3px;
}
.for-you-card img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  background:rgba(255,255,255,.025);
}
.for-you-card-meta{
  position:absolute;
  left:5px;
  right:5px;
  bottom:5px;
  padding:4px 5px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.42);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  font-size:9px;
  line-height:1.2;
  font-weight:800;
  text-align:center;
  text-shadow:0 2px 8px rgba(0,0,0,.75);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.for-you-empty{
  max-width:760px;
  margin:0 auto;
  border:1px dashed var(--border);
  border-radius:var(--radius);
  padding:22px;
  color:var(--muted);
  text-align:center;
  line-height:1.5;
}
.for-you-popover{
  position:fixed;
  inset:0;
  z-index:2350;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(0,0,0,.18);
}
.for-you-popover.open{ display:flex; }
.for-you-popover-card{
  width:min(92vw, 360px);
  display:grid;
  gap:12px;
  justify-items:center;
  align-items:center;
  padding:14px;
  border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(180deg, rgba(21,23,26,.92) 0%, rgba(16,17,20,.96) 100%);
  box-shadow:0 24px 70px rgba(0,0,0,.62);
}
.for-you-popover-media{
  width:100%;
  max-width:320px;
  aspect-ratio:3/4;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.10);
}
.for-you-popover-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.for-you-popover-title{
  width:100%;
  display:grid;
  gap:3px;
  text-align:center;
  font-size:13px;
  line-height:1.35;
}
.for-you-popover-title strong{ font-size:14px; }
.for-you-popover-title span{ color:var(--muted); }
.for-you-actions{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:18px;
  margin-top:2px;
}
.for-you-action{
  appearance:none;
  border:0;
  background:transparent;
  color:rgba(255,255,255,.94);
  cursor:pointer;
  padding:3px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:transform .15s ease, opacity .15s ease, color .15s ease;
}
.for-you-action .material-symbols-outlined{
  font-size:30px;
  line-height:1;
}
.for-you-action:hover{
  transform:translateY(-1px) scale(1.05);
  color:#fff;
}
.for-you-action:active{ transform:scale(.96); }
.for-you-action.is-active .material-symbols-outlined{
  font-variation-settings:'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24;
}
.for-you-close{
  margin-left:auto;
}
.for-you-close .material-symbols-outlined{
  font-size:30px;
  line-height:1;
}
.for-you-loading{
  max-width:760px;
  margin:0 auto;
  padding:22px;
  color:var(--muted);
  text-align:center;
}
@media (max-width:900px){
  .for-you-grid{ grid-template-columns:repeat(6, minmax(0, 1fr)); gap:7px; }
}
@media (max-width:520px){
  .for-you-row{
    justify-content:center;
    margin-top:9px;
  }
  .for-you-btn{
    width:100%;
    max-width:220px;
  }
  .for-you-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:6px;
  }
  .for-you-card-meta{
    font-size:8px;
    left:4px;
    right:4px;
    bottom:4px;
  }
  .for-you-popover{
    align-items:center;
    justify-content:center;
    padding:14px;
  }
  .for-you-popover-card{
    width:min(94vw, 330px);
  }
}

/* === SOURCE: 011-trade-page-styles.css === */
/* ===== Trade page ===== */
.trade-page-wrap{
  width:100%;
  max-width:900px;
  margin:0 auto;
  display:grid;
  gap:14px;
}
.trade-page-card{
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(154,139,255,.13), rgba(255,255,255,.025));
  padding:14px;
  display:grid;
  gap:13px;
  box-shadow:0 18px 44px rgba(0,0,0,.24);
}
.trade-page-section{
  border:1px solid var(--border);
  background:rgba(255,255,255,.035);
  padding:13px;
  display:grid;
  gap:10px;
}
.trade-page-section-title{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0;
  color:var(--text);
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.trade-page-section-title .material-symbols-outlined{
  font-size:19px;
  color:var(--brand);
}
.trade-page-field{
  display:grid;
  gap:6px;
}
.trade-page-field label{
  color:var(--muted);
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.trade-page-select{
  width:100%;
  min-height:42px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.10);
  background:rgba(0,0,0,0.18);
  color:var(--text);
  padding:10px 12px;
  outline:none;
  font-size:14px;
}
.trade-page-select option{ color:#000; }
.trade-page-select:focus-visible{
  border-color:var(--focus);
  box-shadow:0 0 0 3px var(--focus-ring), var(--shadow);
}
.trade-page-note{
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}
.trade-page-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.trade-page-status{
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}
.trade-page-status.ok{ color:#9be6b5; }
.trade-page-status.err{ color:#ff9aa2; }
.trade-page-preview{
  display:grid;
  grid-template-columns:86px minmax(0,1fr);
  gap:12px;
  align-items:center;
  border:1px solid var(--border);
  background:rgba(0,0,0,.14);
  padding:10px;
}
.trade-page-preview img{
  width:86px;
  aspect-ratio:3/4;
  object-fit:contain;
  background:rgba(255,255,255,.04);
}
.trade-page-preview-copy{
  min-width:0;
  display:grid;
  gap:5px;
}
.trade-page-preview-copy strong{ overflow-wrap:anywhere; }
.trade-page-preview-copy span{ color:var(--muted); font-size:12px; overflow-wrap:anywhere; }
@media (max-width:520px){
  .trade-page-preview{ grid-template-columns:64px minmax(0,1fr); }
  .trade-page-preview img{ width:64px; }
}

/* === SOURCE: 012-price-guide-value-signal-styles.css === */
.mc-price-value-card .mc-price-chart-title{margin-bottom:12px;}
.mc-value-signal-wrap{width:100%;display:grid;gap:14px;}
.mc-value-signal-hero{border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg, rgba(154,139,255,.13), rgba(255,255,255,.025));padding:14px;display:grid;gap:13px;box-shadow:0 18px 44px rgba(0,0,0,.24);}
.mc-value-signal-hero.level-1{border-color:rgba(255,70,70,.45);background:linear-gradient(180deg, rgba(255,70,70,.16), rgba(255,255,255,.025));box-shadow:0 18px 44px rgba(255,70,70,.10);}
.mc-value-signal-hero.level-2{border-color:rgba(255,155,55,.48);background:linear-gradient(180deg, rgba(255,155,55,.17), rgba(255,255,255,.025));box-shadow:0 18px 44px rgba(255,155,55,.10);}
.mc-value-signal-hero.level-3{border-color:rgba(80,220,125,.50);background:linear-gradient(180deg, rgba(80,220,125,.18), rgba(255,255,255,.025));box-shadow:0 18px 44px rgba(80,220,125,.11);}
.mc-value-signal-hero.level-4{border-color:rgba(154,139,255,.52);background:linear-gradient(180deg, rgba(154,139,255,.18), rgba(255,255,255,.025));box-shadow:0 18px 44px rgba(154,139,255,.12);}
.mc-value-signal-hero.level-1 .mc-value-signal-score{border-color:rgba(255,70,70,.55);background:rgba(255,70,70,.13);}
.mc-value-signal-hero.level-2 .mc-value-signal-score{border-color:rgba(255,155,55,.58);background:rgba(255,155,55,.14);}
.mc-value-signal-hero.level-3 .mc-value-signal-score{border-color:rgba(80,220,125,.60);background:rgba(80,220,125,.15);}
.mc-value-signal-hero.level-4 .mc-value-signal-score{border-color:rgba(154,139,255,.62);background:rgba(154,139,255,.16);}
.mc-value-signal-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
.mc-value-signal-kicker{color:var(--muted);font-size:11px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;}
.mc-value-signal-level{margin-top:3px;font-size:clamp(20px,4vw,34px);line-height:1.08;font-weight:900;}
.mc-value-signal-score{min-width:82px;text-align:center;border:1px solid rgba(255,255,255,.16);background:rgba(0,0,0,.18);padding:9px 10px;}
.mc-value-signal-score strong{display:block;font-size:26px;line-height:1;}
.mc-value-signal-score span{display:block;margin-top:3px;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;}
.mc-value-signal-meter{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding-top:16px;}
.mc-value-signal-segment{appearance:none;-webkit-appearance:none;min-height:42px;display:flex;align-items:center;justify-content:center;text-align:center;padding:7px 5px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.045);color:rgba(255,255,255,.68);font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;}
.mc-value-signal-segment.is-active{color:#fff;border-color:rgba(255,255,255,.42);background:rgba(154,139,255,.34);box-shadow:0 10px 26px rgba(154,139,255,.16), inset 0 0 0 1px rgba(255,255,255,.08);}
.mc-value-signal-segment.level-1{border-color:rgba(255,70,70,.35);background:rgba(255,70,70,.10);}
.mc-value-signal-segment.level-2{border-color:rgba(255,155,55,.38);background:rgba(255,155,55,.11);}
.mc-value-signal-segment.level-3{border-color:rgba(80,220,125,.38);background:rgba(80,220,125,.11);}
.mc-value-signal-segment.level-4{border-color:rgba(154,139,255,.42);background:rgba(154,139,255,.13);}
.mc-value-signal-segment.level-1.is-active{border-color:rgba(255,70,70,.75);background:rgba(255,70,70,.36);box-shadow:0 10px 26px rgba(255,70,70,.18), inset 0 0 0 1px rgba(255,255,255,.08);}
.mc-value-signal-segment.level-2.is-active{border-color:rgba(255,155,55,.78);background:rgba(255,155,55,.38);box-shadow:0 10px 26px rgba(255,155,55,.18), inset 0 0 0 1px rgba(255,255,255,.08);}
.mc-value-signal-segment.level-3.is-active{border-color:rgba(80,220,125,.78);background:rgba(80,220,125,.38);box-shadow:0 10px 26px rgba(80,220,125,.18), inset 0 0 0 1px rgba(255,255,255,.08);}
.mc-value-signal-segment.level-4.is-active{border-color:rgba(154,139,255,.82);background:rgba(154,139,255,.42);box-shadow:0 10px 26px rgba(154,139,255,.20), inset 0 0 0 1px rgba(255,255,255,.08);}

.mc-value-signal-pointer{position:absolute;top:-1px;left:0;transform:translateX(-50%);color:#fff;font-size:18px;line-height:1;text-shadow:0 4px 14px rgba(0,0,0,.7);transition:left .22s ease;}
.mc-value-signal-summary{color:var(--muted);font-size:13px;line-height:1.5;}
.mc-value-signal-more{display:grid;gap:0;}
.mc-value-signal-more-toggle{appearance:none;-webkit-appearance:none;width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--border);background:rgba(255,255,255,.04);color:var(--text);cursor:pointer;padding:9px 11px;font-size:12px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;transition:border-color .18s ease, background .18s ease, transform .18s ease;}
.mc-value-signal-more-toggle:hover{border-color:rgba(255,255,255,.42);background:rgba(255,255,255,.08);transform:translateY(-1px);}
.mc-value-signal-more-toggle:active{transform:translateY(0);}
.mc-value-signal-more-toggle .material-symbols-outlined{font-size:18px;line-height:1;transition:transform .18s ease;}
.mc-value-signal-more-content{max-height:0;overflow:hidden;color:var(--muted);font-size:13px;line-height:1.5;transition:max-height .26s ease, margin-top .18s ease, opacity .18s ease;opacity:0;}
.mc-value-signal-more.is-open .mc-value-signal-more-content{max-height:220px;margin-top:8px;opacity:1;}
.mc-value-signal-more.is-open .mc-value-signal-more-toggle .material-symbols-outlined{transform:rotate(180deg);}
.mc-value-signal-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
.mc-value-signal-stat{min-width:0;border:1px solid var(--border);background:rgba(255,255,255,.035);padding:11px;display:grid;gap:5px;}
.mc-value-signal-stat label{color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;}
.mc-value-signal-stat-head{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;}
.mc-value-signal-stat-head label{min-width:0;overflow-wrap:anywhere;}
.mc-value-signal-info-btn{appearance:none;-webkit-appearance:none;flex:0 0 auto;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);background:rgba(255,255,255,.04);color:var(--text);cursor:pointer;border-radius:999px;padding:0;transition:border-color .18s ease, background .18s ease, transform .18s ease;}
.mc-value-signal-info-btn:hover{border-color:rgba(255,255,255,.45);background:rgba(255,255,255,.09);transform:translateY(-1px);}
.mc-value-signal-info-btn:active{transform:translateY(0) scale(.98);}
.mc-value-signal-info-btn .material-symbols-outlined{font-size:16px;line-height:1;}
.mc-value-signal-stat strong{font-size:18px;line-height:1.15;overflow-wrap:anywhere;}
.mc-value-signal-stat span{color:var(--muted);font-size:11px;line-height:1.35;}
.mc-value-signal-stat-value{display:flex;align-items:center;gap:7px;min-width:0;white-space:nowrap;overflow:hidden;}
.mc-value-signal-stat-value > strong{flex:0 0 auto;}
.mc-value-signal-applied-tags{min-width:0;display:flex;align-items:center;gap:5px;white-space:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.mc-value-signal-applied-tags::-webkit-scrollbar{display:none;}
.mc-value-signal-tag{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;max-width:150px;padding:3px 7px;border:1px solid rgba(255,255,255,.13);background:rgba(0,0,0,.20);color:rgba(255,255,255,.84);font-size:9px;font-weight:900;line-height:1.1;letter-spacing:.06em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mc-value-signal-tag.market{border-color:rgba(154,139,255,.36);background:rgba(154,139,255,.13);}
.mc-value-signal-tag.value{border-color:rgba(80,220,125,.34);background:rgba(80,220,125,.12);}
.mc-value-signal-tag.issue{border-color:rgba(255,214,0,.35);background:rgba(255,214,0,.10);}
@media (max-width:620px){.mc-value-signal-stat-value{gap:6px;}.mc-value-signal-tag{max-width:118px;font-size:8px;padding:3px 6px;}.mc-value-signal-applied-tags{flex:1 1 auto;}}
.mc-value-signal-stat-graph{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;margin-top:4px;}
.mc-value-signal-stat-graph .mc-value-signal-track{height:8px;background:rgba(255,255,255,.08);overflow:hidden;}
.mc-value-signal-stat-graph .mc-value-signal-fill{height:100%;width:0;background:rgba(154,139,255,.62);box-shadow:0 0 20px rgba(154,139,255,.22);}
.mc-value-signal-stat-graph strong{font-size:12px;min-width:38px;text-align:right;color:var(--text);}
.mc-value-signal-more-toggle{display:none;}
.mc-value-signal-more-content{border:1px solid var(--border);background:rgba(0,0,0,.12);padding:0 11px;}
.mc-value-signal-more.is-open .mc-value-signal-more-content{max-height:260px;margin-top:8px;opacity:1;padding:10px 11px;}

.mc-value-signal-breakdown{display:grid;gap:8px;border:1px solid var(--border);background:rgba(0,0,0,.12);padding:12px;}
.mc-value-signal-row{display:grid;grid-template-columns:126px 1fr auto;gap:10px;align-items:center;font-size:12px;}
.mc-value-signal-row label{color:var(--muted);font-weight:900;letter-spacing:.05em;text-transform:uppercase;}
.mc-value-signal-track{height:8px;background:rgba(255,255,255,.08);overflow:hidden;}
.mc-value-signal-fill{height:100%;width:0;background:rgba(154,139,255,.62);box-shadow:0 0 20px rgba(154,139,255,.22);}
.mc-value-signal-row strong{min-width:44px;text-align:right;}
@media (max-width:900px){.mc-value-signal-stats{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:620px){.mc-value-signal-top{align-items:stretch;}.mc-value-signal-score{min-width:70px;}.mc-value-signal-segment{font-size:9px;min-height:38px;}.mc-value-signal-stats{grid-template-columns:1fr;}.mc-value-signal-row{grid-template-columns:1fr;gap:5px;}.mc-value-signal-row strong{text-align:left;}}

/* === SOURCE: 013-price-guide-info-popup-styles.css === */
.price-guide-info-intro{
  display:grid;
  gap:8px;
  padding:14px;
  border:1px solid rgba(154,139,255,.28);
  background:linear-gradient(180deg, rgba(154,139,255,.16), rgba(255,255,255,.025));
  box-shadow:0 14px 34px rgba(0,0,0,.22);
}
.price-guide-info-intro strong{ color:var(--text); }
.price-guide-info-intro p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}
.price-guide-info-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.price-guide-info-card{
  border:1px solid var(--border);
  background:rgba(255,255,255,.035);
  padding:13px;
  display:grid;
  gap:8px;
  min-width:0;
}
.price-guide-info-card h4{
  margin:0;
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--text);
  font-size:13px;
  line-height:1.2;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.price-guide-info-card h4 .material-symbols-outlined{
  font-size:18px;
  color:var(--brand);
}
.price-guide-info-card p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
  font-size:13px;
}
.price-guide-info-pillrow{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:2px;
}
.price-guide-info-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 8px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
  color:rgba(255,255,255,.82);
  font-size:10px;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.price-guide-info-flow{
  display:grid;
  gap:9px;
  padding:13px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.14);
}
.price-guide-info-flow-title{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text);
}
.price-guide-info-flow-title .material-symbols-outlined{
  font-size:18px;
  color:var(--brand);
}
.price-guide-info-steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}
.price-guide-info-step{
  padding:10px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  color:var(--muted);
  font-size:11px;
  line-height:1.35;
}
.price-guide-info-step strong{
  display:block;
  color:var(--text);
  font-size:11px;
  margin-bottom:4px;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.price-guide-info-callout{
  padding:13px;
  border:1px solid rgba(255,214,0,.35);
  background:rgba(255,214,0,.08);
  color:var(--muted);
  line-height:1.55;
}
.price-guide-info-callout strong{ color:var(--text); }
@media (max-width:780px){
  .price-guide-info-grid{ grid-template-columns:1fr; }
  .price-guide-info-steps{ grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
  .price-guide-info-steps{ grid-template-columns:1fr; }
}

/* ===== Polished metric detail popups for Price Guide factors ===== */
.price-guide-metric-popup{display:grid;gap:14px;}
.price-guide-metric-hero{display:grid;gap:10px;padding:15px;border:1px solid rgba(154,139,255,.30);background:linear-gradient(180deg, rgba(154,139,255,.17), rgba(255,255,255,.025));box-shadow:0 16px 38px rgba(0,0,0,.24);}
.price-guide-metric-hero-title{display:flex;align-items:center;gap:9px;color:var(--text);font-weight:900;letter-spacing:.05em;text-transform:uppercase;font-size:13px;}
.price-guide-metric-hero-title .material-symbols-outlined{font-size:20px;color:var(--brand);}
.price-guide-metric-hero-copy{margin:0;color:var(--muted);line-height:1.55;font-size:13px;}
.price-guide-metric-tagrow{display:flex;flex-wrap:wrap;gap:7px;}
.price-guide-metric-tag{display:inline-flex;align-items:center;justify-content:center;padding:5px 9px;border:1px solid rgba(255,255,255,.13);background:rgba(0,0,0,.18);color:rgba(255,255,255,.84);font-size:10px;font-weight:900;letter-spacing:.07em;line-height:1.1;text-transform:uppercase;}
.price-guide-metric-tag.market{border-color:rgba(154,139,255,.36);background:rgba(154,139,255,.13);}
.price-guide-metric-tag.value{border-color:rgba(80,220,125,.34);background:rgba(80,220,125,.12);}
.price-guide-metric-tag.issue{border-color:rgba(255,214,0,.35);background:rgba(255,214,0,.10);}
.price-guide-metric-cardgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.price-guide-metric-card{min-width:0;display:grid;gap:7px;padding:12px;border:1px solid var(--border);background:rgba(255,255,255,.035);}
.price-guide-metric-card.is-wide{grid-column:1 / -1;}
.price-guide-metric-card label{display:flex;align-items:center;gap:7px;color:var(--text);font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;}
.price-guide-metric-card label .material-symbols-outlined{font-size:17px;color:var(--brand);}
.price-guide-metric-card p{margin:0;color:var(--muted);line-height:1.5;font-size:13px;}
.price-guide-metric-card strong{color:var(--text);font-weight:900;}
@media (max-width:780px){.price-guide-metric-cardgrid{grid-template-columns:1fr;}}


/* ===== Price Guide mobile info inside the site's existing fly-up =====
   Layout/chrome come from .ccc-purchase-flyup-* (the same fly-up used by
   Find This Cut on the Web). Only Price Guide content spacing lives here. */
.price-guide-info-flyup-modal .price-guide-mobile-flyup-body{
  display:grid;
  gap:14px;
  min-width:0;
}
@media (max-width:820px), (hover:none) and (pointer:coarse){
  .price-guide-info-flyup-modal .price-guide-mobile-flyup-body .price-guide-info-intro,
  .price-guide-info-flyup-modal .price-guide-mobile-flyup-body .price-guide-info-flow,
  .price-guide-info-flyup-modal .price-guide-mobile-flyup-body .price-guide-info-card,
  .price-guide-info-flyup-modal .price-guide-mobile-flyup-body .price-guide-info-callout,
  .price-guide-info-flyup-modal .price-guide-mobile-flyup-body .price-guide-metric-hero,
  .price-guide-info-flyup-modal .price-guide-mobile-flyup-body .price-guide-metric-card{
    box-shadow:none;
  }
}

/* === SOURCE: 014-mobile-browse-list-fix.css === */
/* Fix mobile Browse List clipping: render the dropdown as a viewport-fixed panel. */
@media (max-width: 780px){
  body.browse-list-open .ac{
    position: fixed !important;
    left: max(12px, env(safe-area-inset-left, 0px)) !important;
    right: max(12px, env(safe-area-inset-right, 0px)) !important;
    top: calc(var(--browse-list-top, 150px) + 8px) !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    max-height: calc(100dvh - var(--browse-list-top, 150px) - 20px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    z-index: 1500 !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  body.browse-list-open .ac-section,
  body.browse-list-open .ac-title,
  body.browse-list-open .ac-subtitle,
  body.browse-list-open .ac-list,
  body.browse-list-open .ac-item{
    max-width: 100%;
    min-width: 0;
  }

  body.browse-list-open .ac-item{
    grid-template-columns: minmax(0, 1fr) auto;
  }

  body.browse-list-open .ac-issue,
  body.browse-list-open .ac-sub{
    overflow-wrap: anywhere;
  }
}

/* === SOURCE: 015-price-guide-set-issue-picker-fix.css === */
.mc-price-picker-option.mc-price-picker-back{
  width:100%;
  border:0;
  border-bottom:1px solid var(--border);
  border-radius:0;
  background:rgba(255,255,255,.035);
  color:var(--text);
  font-weight:800;
  justify-content:flex-start;
  gap:8px;
}
.mc-price-picker-option.mc-price-picker-back .material-symbols-outlined{font-size:18px;}
.mc-price-picker-count{
  margin-left:auto;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}
.mc-price-picker-option[type="button"]{
  width:100%;
  border:1px solid transparent;
  background:transparent;
  color:var(--text);
  text-align:left;
  font:inherit;
}

/* === SOURCE: 016-mobile-grid-edge-border-fix.css === */
/* Fix mobile edge-tile selection border clipping in My Collection grids.
   The original .mini-row:focus outline uses a positive outline-offset, so
   first/last-column tiles draw outside the grid/viewport and get cut off.
   Keep the selected/focused border inside the tile and add a little grid
   breathing room on small screens. */
@media (max-width: 520px){
  .mini-results{
    padding-left: 4px !important;
    padding-right: 4px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  .mini-row{
    overflow: hidden !important;
    outline: none !important;
  }

  .mini-row:focus,
  .mini-row:focus-visible,
  .mini-row.mini-popover-open{
    outline: none !important;
    box-shadow:
      inset 0 0 0 2px rgba(0,0,0,0.95),
      inset 0 0 0 4px rgba(255,255,255,0.18) !important;
  }
}

/* === SOURCE: 017-mobile-scroll-blank-card-fix.css === */
@media (max-width:780px){

  /* Keep the shared viewport-fixed topbar and the body's --topbar-h clearance.
     The blank-card fix only needs the paint/containment safeguards below. */

  /* IMPORTANT:
     Do not use content-visibility or contain on .mini-results, .for-you-grid,
     .comic-cuts-list, .mini-row, or .card. Mobile browsers can skip painting
     those during fast scrolls, showing only the background. */

  .mini-results,
  .for-you-grid,
  .comic-cuts-list,
  .mini-row,
  .for-you-card,
  .comic-cuts-row,
  .card{
    content-visibility: visible !important;
    contain: none !important;
  }
/* Prevent horizontal jitter without affecting vertical painting */
  body{
    overflow-x:hidden;
  }
}

/* === SOURCE: 018-my-collection-header-controls-repaint-fix.css === */
/* Mobile-only repaint fix for My Collection header and controls.
   This is intentionally scoped to the collection header/buttons/filter/sort UI only.
   It does not alter Browse List, card grids, cards, or card overlays. */
@media (max-width:780px){

  .mc-profile-wrap,
  .mc-header-wrap,
  .mc-profile-card,
  .mc-profile-row,
  .mc-profile-left,
  .mc-tabs,
  .mc-toolbar,
  .mc-toolbar-actions,
  .mc-sort-wrap,
  .mc-sort-icon-btn,
  .mc-filters-toggle,
  #mcFiltersMount{
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }

  .mc-profile-wrap,
  .mc-header-wrap{
    position: relative;
    z-index: 90;
    isolation: isolate;
  }

  .mc-sort-menu,
  .mc-filters-panel{
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }
}

/* === SOURCE: 019-my-collection-mobile-performance-fix-v2.css === */
/* Mobile-only My Collection performance pass.
   Keeps desktop styling intact while reducing the expensive paint/compositing work
   that was making collection grids blank during fast mobile scrolls. */
@media (max-width:780px){
  #result .mc-profile-wrap ~ .mini-results{
    min-height:40vh;
    overflow-x:hidden;
    overscroll-behavior:contain;
  }

  #result .mc-profile-wrap ~ .mini-results .mini-row,
  #result .mc-profile-wrap ~ .mini-results .mini-issue-header{
    transition:none !important;
    transform:none !important;
    will-change:auto !important;
    backface-visibility:visible !important;
    -webkit-backface-visibility:visible !important;
  }

  #result .mc-profile-wrap ~ .mini-results .mini-row:hover,
  #result .mc-profile-wrap ~ .mini-results .mini-row:active,
  #result .mc-profile-wrap ~ .mini-results .mini-issue-header:hover,
  #result .mc-profile-wrap ~ .mini-results .mini-issue-header:active{
    transform:none !important;
  }

  #result .mc-profile-wrap ~ .mini-results .mc-issue-overlay,
  #result .mc-profile-wrap ~ .mini-results .mini-popover,
  #result .mc-profile-wrap ~ .mini-results .mini-flag,
  #result .mc-profile-card,
  #result .mc-filters-panel,
  #result .mc-sort-menu{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  #result .mc-profile-wrap ~ .mini-results .mc-issue-overlay{
    background:rgba(10,10,12,.62) !important;
    transition:none !important;
    will-change:auto !important;
  }

  #result .mc-profile-wrap ~ .mini-results .mini-popover{
    background:rgba(10,10,12,.64) !important;
  }

  #result .mc-profile-card{
    background:rgba(255,255,255,.075) !important;
  }

  #result .mc-profile-wrap ~ .mc-gallery .mc-gallery-viewport::before{
    display:none !important;
  }

  #result .mc-profile-wrap ~ .mc-gallery .mc-gallery-track,
  #result .mc-profile-wrap ~ .mc-gallery .mc-gallery-card{
    transition:none !important;
    will-change:auto !important;
  }

  #result .mc-profile-wrap ~ .mc-gallery .mc-gallery-card{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  /* Remove an extra composited layer from the fixed gradient on phones. */
  html::before{
    transform:none !important;
    will-change:auto !important;
  }
}

/* === SOURCE: 020-comic-cuts-mobile-grid-render-fix.css === */
/* Scoped to the collection/favorites/for-you mini grids only.
   The JS now renders mobile grids progressively and loads grouped comic-cut
   rows only when an issue is opened, so this sentinel remains invisible. */
.mini-results .mc-grid-sentinel{
  grid-column:1 / -1;
  width:100%;
  height:1px;
  pointer-events:none;
}
@media (max-width:780px){
  #result .mini-results .mini-tile-img,
  #result .mini-results .mini-issue-header > img{
    transform:none !important;
    will-change:auto !important;
    backface-visibility:visible !important;
    -webkit-backface-visibility:visible !important;
  }
}

/* === SOURCE: 021-mc-mobile-flat-header-redraw-fix-no-position-change.css === */
/* Mobile-only fix for My Collection -> comic cuts grid view.
   No sticky/fixed positioning and no margin/top changes: this keeps the
   header exactly where the original layout placed it, while separating it
   from the heavy image grid repaint path. */
@media (max-width:780px){
  body.mc-mobile-collection-flat-active #result > .mc-profile-wrap,
  body.mc-mobile-collection-flat-active #result > .mc-mode-label,
  body.mc-mobile-collection-flat-active #result > .mc-tabs,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar{
    position: relative !important;
    z-index: 120 !important;
    isolation: isolate !important;
    transform: translateZ(0) !important;
    -webkit-transform: translateZ(0) !important;
    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
    contain: layout paint style !important;
  }

  body.mc-mobile-collection-flat-active #result > .mc-profile-wrap .mc-profile-card,
  body.mc-mobile-collection-flat-active #result > .mc-profile-wrap .mc-profile-row,
  body.mc-mobile-collection-flat-active #result > .mc-profile-wrap .mc-profile-expand{
    transform: translateZ(0) !important;
    -webkit-transform: translateZ(0) !important;
    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
    will-change: opacity !important;
  }

  body.mc-mobile-collection-flat-active #result > .mc-profile-wrap .mc-profile-card{
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(255,255,255,.085) !important;
  }

  body.mc-mobile-collection-flat-active.mc-grid-scroll-active #result > .mc-profile-wrap .mc-profile-card,
  body.mc-mobile-collection-flat-active.mc-grid-scroll-active #result > .mc-toolbar,
  body.mc-mobile-collection-flat-active.mc-grid-scroll-active #result > .mc-tabs{
    opacity: .999 !important;
    outline: 1px solid rgba(255,255,255,.001) !important;
  }

  body.mc-mobile-collection-flat-active #result > .mini-results{
    /* Make the image grid less likely to repaint over/starve the header. */
    position: relative !important;
    z-index: 1 !important;
    contain: layout style !important;
  }
}

/* === SOURCE: 022-mobile-collection-toolbar-position-match-fix.css === */
/* Mobile-only alignment correction for My Collection -> comic cuts grid view.
   Match the same toolbar vertical placement used by Favorites/grouped views.
   The earlier unblock fix added top padding to avoid clipping; the panel
   overflow/z-index fixes now handle that, so the padding is no longer needed. */
@media (max-width:780px){
  body.mc-mobile-collection-flat-active #result > .mc-toolbar{
    padding-top:0 !important;
    margin-top:2px !important;
    align-items:center !important;
  }

  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-filters-toggle,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-view-toggle-btn,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-sort-icon-btn{
    margin-top:0 !important;
    transform:none;
  }
}

/* === SOURCE: 023-mobile-right-flyout-archive-opacity-fix.css === */
/* Mobile right flyout opacity fix.
   Keeps the account flyout visually solid above the Comic Cut Archive mobile
   dropdown/portal layers without changing archive cards or layout. */
@media (max-width:780px){
  #rightFlyout.flyout.right.open{
    opacity:1 !important;
    background:linear-gradient(180deg, #15171a 0%, #101114 100%) !important;
    background-color:#15171a !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    z-index:2147483001 !important;
  }
}

/* === SOURCE: 024-standalone-page-title-patch.css === */
.mc-price-guide-simple-toolbar{
  justify-content:center;
  margin-top:0;
  margin-bottom:14px;
}
.mc-price-guide-simple-toolbar .mc-price-guide-picker-mount{
  width:100%;
}

/* === SOURCE: 025-comic-cut-fit-screen-gallery-styles.css === */
/* ===== Fit Screen image gallery popup ===== */
.ccc-gallery-overlay{
  position:fixed;
  inset:0;
  z-index:2450;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(0,0,0,.68);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.ccc-gallery-overlay.open{ display:flex; }
.ccc-gallery-modal{
  width:min(94vw, 920px);
  max-height:min(90vh, 900px);
  max-height:min(90dvh, 900px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg, rgba(21,23,26,.96) 0%, rgba(16,17,20,.98) 100%);
  box-shadow:0 24px 70px rgba(0,0,0,.58);
}
.ccc-gallery-toolbar{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-bottom:1px solid var(--border);
}
.ccc-gallery-rotate,
.ccc-gallery-close{
  border:none;
  background:transparent;
  color:var(--text);
  box-shadow:none;
}
.ccc-gallery-rotate.is-active{
  color:#fff;
  opacity:1;
}
.ccc-gallery-rotate.is-active .material-symbols-outlined{
  font-variation-settings:'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24;
}
.ccc-gallery-rotate:disabled{
  opacity:.35;
  cursor:not-allowed;
  color:var(--muted);
}
.ccc-gallery-stage-wrap{
  flex:1 1 auto;
  min-height:0;
  padding:14px 14px 8px;
  display:grid;
  place-items:center;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}
.ccc-gallery-stage{
  width:100%;
  min-height:260px;
  max-height:min(66vh, 620px);
  max-height:min(66dvh, 620px);
  display:grid;
  place-items:center;
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.08);
}
.ccc-gallery-stage img{
  max-width:100%;
  max-height:min(64vh, 600px);
  max-height:min(64dvh, 600px);
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  transform-origin:center center;
  transform:translate3d(0,0,0) rotate(0deg) scale(1);
  transition:transform 420ms cubic-bezier(.22,.8,.2,1);
  will-change:transform;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.ccc-gallery-thumbs{
  flex:0 0 auto;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  padding:10px 12px 14px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-top:1px solid var(--border);
}
.ccc-gallery-thumb{
  flex:0 0 auto;
  width:56px;
  height:72px;
  padding:2px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.035);
  color:var(--text);
  cursor:pointer;
}
.ccc-gallery-thumb:hover,
.ccc-gallery-thumb[aria-selected="true"]{
  border-color:rgba(255,255,255,.62);
  background:rgba(255,255,255,.10);
}
.ccc-gallery-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
@media (max-width:780px){
  .ccc-gallery-overlay{ padding:10px; }
  .ccc-gallery-modal{ width:100%; max-height:min(92vh, 920px); max-height:min(92dvh, 920px); }
  .ccc-gallery-stage{ min-height:220px; max-height:min(60vh, 520px); max-height:min(60dvh, 520px); }
  .ccc-gallery-stage img{ max-height:min(58vh, 500px); max-height:min(58dvh, 500px); }
  .ccc-gallery-thumb{ width:52px; height:68px; }
}

/* === SOURCE: 026-ccc-gallery-mobile-save-guard.css === */
/* Prevent mobile long-press save/share callouts and desktop dragging inside the image gallery.
   Note: this discourages casual saving; no front-end code can fully prevent screenshots or network access. */
.ccc-gallery-overlay,
.ccc-gallery-modal,
.ccc-gallery-stage-wrap,
.ccc-gallery-stage,
.ccc-gallery-thumbs,
.ccc-gallery-thumb{
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

.ccc-gallery-stage img,
.ccc-gallery-thumb img{
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
  user-drag: none !important;
  pointer-events: none !important;
}

/* === SOURCE: 027-dashboard-additional-info-box.css === */
/* ===== Additional Information: quiet lined sheet v5 =====
   No hover effects. No card/box tiles. Uses simple label/value rows with soft dividers. */
.card .more{
  display:block;
  padding:6px 14px;
  max-height:360px;
  overflow:auto;
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;

  /* Keep this as a single calm information area, not a grid of boxes. */
  border:1px solid rgba(255,255,255,.085);
  border-radius:12px;
  background:linear-gradient(180deg, rgba(255,255,255,.024), rgba(255,255,255,.010));
  box-shadow:none;
}

/* JS sometimes toggles inline display:block/none. Respect hidden state. */
.card .more[style*="display: block"]{ display:block !important; }
.card .more[style*="display:none"],
.card .more[style*="display: none"]{ display:none !important; }

/* Disable any inherited hover behavior on the Additional Information container. */
.card .more:hover,
.card .more:active{
  border-color:rgba(255,255,255,.085) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.024), rgba(255,255,255,.010)) !important;
}

.card .more .kv,
.card .more .kv.ai-wide{
  min-width:0;
  display:grid !important;
  grid-template-columns:minmax(120px, 32%) minmax(0, 1fr) !important;
  gap:14px;
  align-items:start;
  min-height:0;
  padding:11px 0;
  box-sizing:border-box;
  overflow:visible;

  border:0 !important;
  border-bottom:1px solid rgba(255,255,255,.075) !important;
  background:transparent !important;
  box-shadow:none !important;
}

.card .more .kv:last-child{
  border-bottom:0 !important;
}

.card .more .kv::before,
.card .more .kv::after{
  display:none !important;
  content:none !important;
}

.card .more .kv .k,
.card .more .kv .v{
  min-width:0;
  position:static;
  z-index:auto;
}

.card .more .kv .k{
  color:rgba(168,172,179,.88);
  font-size:10px;
  font-weight:820;
  letter-spacing:.075em;
  line-height:1.35;
  text-transform:uppercase;
  overflow-wrap:anywhere;
  padding-top:1px;
}

.card .more .kv .v{
  color:rgba(238,240,246,.96);
  font-size:13.5px;
  font-weight:650;
  line-height:1.42;
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* Remove all hover/active feedback from rows. */
.card .more .kv:hover,
.card .more .kv:active,
.card .more .kv.ai-identity:hover,
.card .more .kv.ai-production:hover,
.card .more .kv.ai-release:hover,
.card .more .kv.ai-status:hover,
.card .more .kv.ai-private:hover,
.card .more .kv.ai-default:hover{
  border-bottom-color:rgba(255,255,255,.075) !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* Previous category classes are intentionally neutral in this layout. */
.card .more .kv.ai-identity,
.card .more .kv.ai-production,
.card .more .kv.ai-release,
.card .more .kv.ai-status,
.card .more .kv.ai-private,
.card .more .kv.ai-default{
  border-color:transparent !important;
  border-bottom-color:rgba(255,255,255,.075) !important;
  background:transparent !important;
}

@media (max-width:780px){
  /* Mobile: turn the sheet into comfortable stacked label/value rows. */
  .card .more,
  .card .more[style*="display: block"]{
    grid-column:1 / -1 !important;
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-top:10px !important;
    padding:3px 10px !important;
    max-height:none !important;
    overflow:visible !important;
    border-color:rgba(255,255,255,.075) !important;
    background:rgba(255,255,255,.012) !important;
    box-shadow:none !important;
    box-sizing:border-box !important;
    contain:none !important;
  }

  .card .more[style*="display:none"],
  .card .more[style*="display: none"]{
    display:none !important;
  }

  .card .more:hover,
  .card .more:active{
    border-color:rgba(255,255,255,.075) !important;
    background:rgba(255,255,255,.012) !important;
  }

  .card .more .kv,
  .card .more .kv.ai-wide{
    grid-template-columns:minmax(0, 1fr) !important;
    gap:4px !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding:11px 8px !important;
    overflow:visible !important;
    border:0 !important;
    border-bottom:1px solid rgba(255,255,255,.065) !important;
    background:transparent !important;
    box-shadow:none !important;
    contain:none !important;
    justify-items:center !important;
    text-align:center !important;
  }

  .card .more .kv:last-child{
    border-bottom:0 !important;
  }

  .card .more .kv .k{
    width:100% !important;
    max-width:92% !important;
    font-size:8.5px !important;
    line-height:1.2 !important;
    letter-spacing:.07em !important;
    white-space:normal !important;
    padding-top:0 !important;
    text-align:center !important;
    justify-self:center !important;
  }
  .card .more .kv .v{
    width:100% !important;
    max-width:92% !important;
    font-size:12.5px !important;
    line-height:1.34 !important;
    font-weight:640 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
    text-align:center !important;
    justify-self:center !important;
  }
}

@media (max-width:480px){
  .card .more,
  .card .more[style*="display: block"]{
    width:calc(100% - 4px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:8px !important;
    padding-right:8px !important;
  }

  .card .more .kv .k,
  .card .more .kv .v{
    max-width:96% !important;
  }
}

/* === SOURCE: 028-comic-cut-highlight-panel-styles.css === */
/* ===== Companion Value Highlights panel beside Additional Information ===== */
.card .details-panels{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:12px;
  align-items:stretch;
  margin-top:12px;
}
.card .details-panels .more{
  margin-top:0 !important;
  height:360px;
  max-height:360px;
}
.cc-highlights-panel{
  width:100%;
  min-width:0;
  height:360px;
  max-height:360px;
  overflow:auto;
  box-sizing:border-box;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.085);
  border-radius:12px;
  background:linear-gradient(180deg, rgba(255,255,255,.024), rgba(255,255,255,.010));
  box-shadow:none;
}
.cc-highlights-panel,
.cc-highlights-panel *{
  -webkit-tap-highlight-color:transparent;
}
.cc-highlights-panel:hover,
.cc-highlights-panel:active{
  border-color:rgba(255,255,255,.085) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.024), rgba(255,255,255,.010)) !important;
}
.cc-highlights-head{
  display:grid;
  gap:6px;
  padding-bottom:11px;
}
.cc-highlights-kicker{
  color:rgba(168,172,179,.88);
  font-size:10px;
  font-weight:820;
  letter-spacing:.075em;
  line-height:1.3;
  text-transform:uppercase;
}
.cc-highlights-title-row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
}
.cc-highlights-title{
  color:rgba(238,240,246,.96);
  font-size:16px;
  line-height:1.15;
  font-weight:760;
}
.cc-highlights-level{
  color:rgba(238,240,246,.84);
  font-size:11px;
  font-weight:820;
  letter-spacing:.05em;
  text-transform:uppercase;
  white-space:nowrap;
}
.cc-highlights-meter{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:5px;
  margin-top:3px;
}
.cc-highlights-meter span{
  height:5px;
  background:rgba(255,255,255,.075);
}
.cc-highlights-meter[data-level="1"] span:nth-child(-n+1),
.cc-highlights-meter[data-level="2"] span:nth-child(-n+2),
.cc-highlights-meter[data-level="3"] span:nth-child(-n+3),
.cc-highlights-meter[data-level="4"] span:nth-child(-n+4){
  background:rgba(255,255,255,.50);
}
.cc-highlights-summary{
  margin-top:3px;
  color:rgba(168,172,179,.92);
  font-size:12.5px;
  line-height:1.45;
}
.cc-highlights-list{
  display:grid;
  padding-top:0;
}
.cc-highlight-row{
  display:grid;
  grid-template-columns:22px minmax(0,1fr);
  gap:10px;
  padding:11px 0;
  border-bottom:1px solid rgba(255,255,255,.065);
}
.cc-highlight-row:last-child{ border-bottom:0; }
.cc-highlight-row:hover,
.cc-highlight-row:active{
  background:transparent !important;
  box-shadow:none !important;
}
.cc-highlight-icon{
  width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:rgba(238,240,246,.78);
  opacity:.92;
}
.cc-highlight-icon .material-symbols-outlined{
  font-size:18px;
  line-height:1;
}
.cc-highlight-copy{
  min-width:0;
  display:grid;
  gap:3px;
}
.cc-highlight-label{
  color:rgba(168,172,179,.88);
  font-size:9.5px;
  font-weight:820;
  letter-spacing:.075em;
  line-height:1.25;
  text-transform:uppercase;
}
.cc-highlight-value{
  color:rgba(238,240,246,.96);
  font-size:13.5px;
  line-height:1.35;
  font-weight:680;
  overflow-wrap:anywhere;
}
.cc-highlight-note{
  color:rgba(168,172,179,.86);
  font-size:11.5px;
  line-height:1.4;
  overflow-wrap:anywhere;
}
.cc-highlight-empty{
  padding:12px 0 2px;
  color:rgba(168,172,179,.90);
  font-size:12.5px;
  line-height:1.45;
}
@media (max-width:900px){
  .card .details-panels{
    grid-template-columns:1fr;
  }
}
@media (max-width:780px){
  .card .details-panels{
    grid-column:1 / -1 !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    margin-top:10px !important;
    box-sizing:border-box !important;
  }
  .cc-highlights-panel{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    max-height:320px !important;
    overflow:auto !important;
    padding:11px 14px !important;
    background:rgba(255,255,255,.012) !important;
    border-color:rgba(255,255,255,.075) !important;
  }
  .card .details-panels .more,
  .card .details-panels .more[style*="display: block"]{
    height:auto !important;
    max-height:none !important;
    margin-top:0 !important;
  }
  /* Keep Value Highlights internals aligned like desktop on mobile.
     Only the two outer panels stack; the rows themselves remain icon + text. */
  .cc-highlights-title-row{
    display:flex !important;
    align-items:baseline !important;
    justify-content:space-between !important;
    text-align:left !important;
    gap:10px !important;
  }
  .cc-highlights-head{ text-align:left !important; }
  .cc-highlight-row{
    grid-template-columns:22px minmax(0,1fr) !important;
    justify-items:stretch !important;
    text-align:left !important;
    gap:10px !important;
    padding:11px 0 !important;
  }
  .cc-highlight-copy{ justify-items:stretch !important; text-align:left !important; }
  .cc-highlight-value,
  .cc-highlight-note{ max-width:100% !important; }
}
@media (max-width:480px){
  .card .details-panels{
    width:calc(100% - 4px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .cc-highlights-panel{
    padding-left:12px !important;
    padding-right:12px !important;
  }
}

/* === SOURCE: 029-pill-details-column-alignment-fix.css === */
/* Align the desktop column break of the top info pills with the lower
   Value Highlights / Additional Information two-panel layout. */
@media (min-width: 901px){
  .card .pillgrid{
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr) !important;
    gap: 12px !important;
  }

  .card .pill{
    min-width: 0 !important;
  }
}

/* When the lower panels collapse to one column, make the top pill area
   collapse at the same breakpoint so the visual rhythm stays aligned. */
@media (min-width: 781px) and (max-width: 900px){
  .card .pillgrid{
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
}

/* === SOURCE: 030-comic-cut-nav-column-alignment-fix.css === */
/* Align Back to Set/My Collection + Next Comic Cut with the same
   desktop column structure used by the top pills and lower detail panels. */
@media (min-width: 901px){
  .card .comic-cut-nav.is-visible{
    display:grid !important;
    grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr) !important;
    gap:12px !important;
    align-items:stretch !important;
    width:100% !important;
    margin:10px 0 12px !important;
  }

  .card .comic-cut-nav-btn{
    width:100% !important;
    min-width:0 !important;
    flex:none !important;
    box-sizing:border-box !important;
  }

  .card .comic-cut-nav-btn:first-child{
    justify-content:flex-start !important;
    text-align:left !important;
  }

  .card .comic-cut-nav-btn:last-child{
    justify-content:flex-end !important;
    text-align:right !important;
  }
}

/* Match the same collapse point as the pill grid and details panels. */
@media (min-width: 781px) and (max-width: 900px){
  .card .comic-cut-nav.is-visible{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
    width:100% !important;
  }

  .card .comic-cut-nav-btn,
  .card .comic-cut-nav-btn:first-child,
  .card .comic-cut-nav-btn:last-child{
    width:100% !important;
    justify-content:center !important;
    text-align:center !important;
  }
}

@media (max-width: 780px){
  /* Restore the original mobile nav behavior. Desktop/tablet alignment above
     should not change the phone button layout. */
  .card .comic-cut-nav.is-visible{
    display:flex !important;
    grid-template-columns:none !important;
    gap:8px !important;
    width:100% !important;
    margin:0 0 10px !important;
    padding:0 !important;
  }

  .card .comic-cut-nav-btn{
    flex:1 1 0 !important;
    width:auto !important;
    min-width:0 !important;
    font-size:13px !important;
    min-height:38px !important;
    padding:8px !important;
  }

  .card .comic-cut-nav-btn:first-child{
    justify-content:flex-start !important;
    text-align:left !important;
  }

  .card .comic-cut-nav-btn:last-child{
    justify-content:flex-end !important;
    text-align:right !important;
  }
}

/* === SOURCE: 031-remove-outer-comic-cut-shell.css === */
/* Remove the outer bordered/glass shell around the comic cut detail view.
   Keep the internal image, pill grid, navigation, Value Highlights, and
   Additional Information panels intact. */
#result > .card,
.result > .card{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* === SOURCE: 032-main-cut-subtle-color-theme.css === */
/* ===== Main comic cut detail view: subtle themed color pass =====
   Soft site-matching accents only. No bright blocks, no new hover behavior. */
:root{
  --cc-accent-purple: rgba(154,139,255,.46);
  --cc-accent-purple-soft: rgba(154,139,255,.105);
  --cc-accent-teal: rgba(95,238,218,.34);
  --cc-accent-teal-soft: rgba(95,238,218,.075);
  --cc-accent-gold: rgba(255,214,120,.32);
  --cc-accent-gold-soft: rgba(255,214,120,.070);
  --cc-accent-blue: rgba(120,170,255,.34);
  --cc-accent-blue-soft: rgba(120,170,255,.075);
  --cc-panel-glow: 0 18px 42px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035);
}

/* Top metadata pills: keep the shape, add calm intentional accents. */
.card .pill{
  position:relative;
  overflow:hidden;
  border-color:rgba(255,255,255,.092) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)),
    radial-gradient(220px 80px at 0% 0%, var(--cc-accent-purple-soft), transparent 72%) !important;
  box-shadow:inset 3px 0 0 rgba(255,255,255,.10);
}
.card .pill label{
  color:rgba(201,196,255,.82) !important;
}
.card .pill:nth-child(2n){
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.016)),
    radial-gradient(220px 80px at 0% 0%, var(--cc-accent-teal-soft), transparent 72%) !important;
  box-shadow:inset 3px 0 0 rgba(95,238,218,.24);
}
.card .pill:nth-child(3n){
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.016)),
    radial-gradient(220px 80px at 0% 0%, var(--cc-accent-blue-soft), transparent 72%) !important;
  box-shadow:inset 3px 0 0 rgba(120,170,255,.22);
}
.card .pill:nth-child(5n){
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.016)),
    radial-gradient(220px 80px at 0% 0%, var(--cc-accent-gold-soft), transparent 72%) !important;
  box-shadow:inset 3px 0 0 rgba(255,214,120,.22);
}
.card .pill:nth-child(2n) label{ color:rgba(176,246,235,.78) !important; }
.card .pill:nth-child(3n) label{ color:rgba(190,211,255,.78) !important; }
.card .pill:nth-child(5n) label{ color:rgba(255,226,168,.76) !important; }

/* Navigation buttons: a faint color edge so they belong with the detail view. */
.card .comic-cut-nav-btn{
  border-color:rgba(255,255,255,.09) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.030), rgba(255,255,255,.010)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.card .comic-cut-nav-btn:first-child{
  box-shadow:inset 3px 0 0 rgba(154,139,255,.26), inset 0 1px 0 rgba(255,255,255,.035);
}
.card .comic-cut-nav-btn:last-child{
  box-shadow:inset -3px 0 0 rgba(95,238,218,.22), inset 0 1px 0 rgba(255,255,255,.035);
}

/* Shared panel treatment for Value Highlights and Additional Information. */
.cc-highlights-panel,
.card .details-panels .more,
.card .more{
  border-color:rgba(154,139,255,.15) !important;
  background:
    linear-gradient(180deg, rgba(154,139,255,.044), rgba(255,255,255,.012) 42%, rgba(255,255,255,.008)),
    radial-gradient(520px 160px at 0% -10%, rgba(154,139,255,.075), transparent 68%) !important;
  box-shadow:var(--cc-panel-glow) !important;
}
.cc-highlights-panel,
.card .details-panels .more{
  position:relative;
}
.cc-highlights-panel::before,
.card .details-panels .more::before{
  content:"";
  position:sticky;
  top:0;
  display:block;
  height:2px;
  margin:-12px -14px 10px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(154,139,255,.55), rgba(95,238,218,.30), transparent 78%);
  pointer-events:none;
  z-index:1;
}
.card .details-panels .more::before{
  margin:-6px -14px 4px;
}

/* Value Highlights: use restrained accents on labels/icons, not colorful blocks. */
.cc-highlights-kicker,
.cc-highlight-label,
.card .more .kv .k{
  color:rgba(201,196,255,.78) !important;
}
.cc-highlights-title,
.cc-highlight-value,
.card .more .kv .v{
  color:rgba(242,243,255,.96) !important;
}
.cc-highlight-icon{
  color:rgba(154,139,255,.82) !important;
}
.cc-highlight-row:nth-child(2n) .cc-highlight-icon{
  color:rgba(95,238,218,.72) !important;
}
.cc-highlight-row:nth-child(3n) .cc-highlight-icon{
  color:rgba(255,214,120,.70) !important;
}
.cc-highlight-row,
.card .more .kv,
.card .more .kv.ai-wide{
  border-bottom-color:rgba(255,255,255,.080) !important;
}
.cc-highlight-note,
.cc-highlights-summary{
  color:rgba(181,185,198,.88) !important;
}

/* Keep the previous no-hover behavior for the info panels. */
.cc-highlights-panel:hover,
.cc-highlights-panel:active,
.card .more:hover,
.card .more:active{
  border-color:rgba(154,139,255,.15) !important;
  background:
    linear-gradient(180deg, rgba(154,139,255,.044), rgba(255,255,255,.012) 42%, rgba(255,255,255,.008)),
    radial-gradient(520px 160px at 0% -10%, rgba(154,139,255,.075), transparent 68%) !important;
  box-shadow:var(--cc-panel-glow) !important;
}

@media (max-width:780px){
  .cc-highlights-panel,
  .card .details-panels .more,
  .card .more,
  .card .more[style*="display: block"]{
    border-color:rgba(154,139,255,.13) !important;
    background:
      linear-gradient(180deg, rgba(154,139,255,.034), rgba(255,255,255,.010) 45%, rgba(255,255,255,.006)),
      radial-gradient(360px 120px at 0% -12%, rgba(154,139,255,.055), transparent 72%) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.030) !important;
  }
  .cc-highlights-panel::before,
  .card .details-panels .more::before{
    height:2px;
    margin-left:-12px;
    margin-right:-12px;
  }
}

/* === SOURCE: 033-main-cut-color-polish-edits.css === */
/* Requested refinements:
   - Total comic cuts in Value Highlights matches the Serial Number gold accent.
   - Remove the colored top line from Value Highlights and Additional Information.
   - Keep Back/Next buttons white-accented. */
.card .cc-highlight-total-comic-cuts-for-issue .cc-highlight-icon,
.card .cc-highlight-total-comic-cuts-for-issue .cc-highlight-label{
  color: rgba(255,214,120,.86) !important;
}
.card .cc-highlight-total-comic-cuts-for-issue .cc-highlight-value{
  color: rgba(255,232,180,.98) !important;
}
.card .cc-highlight-total-comic-cuts-for-issue{
  border-bottom-color: rgba(255,214,120,.13) !important;
}
.cc-highlights-panel::before,
.card .details-panels .more::before{
  display: none !important;
  content: none !important;
}
.card .comic-cut-nav-btn,
.card .comic-cut-nav-btn:first-child,
.card .comic-cut-nav-btn:last-child{
  color: rgba(255,255,255,.96) !important;
  border-color: rgba(255,255,255,.16) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.038), rgba(255,255,255,.012)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), inset 0 0 0 1px rgba(255,255,255,.025) !important;
}
.card .comic-cut-nav-btn:hover,
.card .comic-cut-nav-btn:active{
  border-color: rgba(255,255,255,.26) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.018)) !important;
  color: #fff !important;
}

/* === SOURCE: 034-owner-colors-highlight-title-accents.css === */
/* Each owner divider in the thumbnail window gets a stable accent from JS. */
.card .altthumbs .alt-owner-divider .lbl{
  color: var(--owner-name-color, rgba(210,203,255,.88)) !important;
  text-shadow: 0 0 18px color-mix(in srgb, var(--owner-name-color, rgba(210,203,255,.88)) 24%, transparent);
}
.card .altthumbs .alt-owner-divider .line{
  background: var(--owner-line-color, rgba(154,139,255,.22)) !important;
}

/* Value Highlights: titles match their icon accent color. */
.card .cc-highlight-row{
  --cc-highlight-accent: rgba(154,139,255,.84);
}
.card .cc-highlight-row .cc-highlight-icon,
.card .cc-highlight-row .cc-highlight-label{
  color: var(--cc-highlight-accent) !important;
}

.card .cc-highlight-first-appearance-comic-cut{ --cc-highlight-accent: rgba(255,214,120,.90); }
.card .cc-highlight-first-appearance-comic-cut .cc-highlight-icon,
.card .cc-highlight-first-appearance-comic-cut .cc-highlight-label{
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  color: rgba(255,214,120,.90) !important;
  text-shadow: 0 0 18px rgba(255,214,120,.20);
}
.card .cc-highlight-error-comic-cut{ --cc-highlight-accent: #ff5c6c; }
.card .cc-highlight-signature-comic-cut{ --cc-highlight-accent: rgba(210,203,255,.92); }
.card .cc-highlight-reprint-status{ --cc-highlight-accent: rgba(120,170,255,.88); }
.card .cc-highlight-total-comic-cuts-for-issue{ --cc-highlight-accent: rgba(255,214,120,.90); }
.card .cc-highlight-sets-featuring-this-issue{ --cc-highlight-accent: #00b7ff; }
.card .cc-highlight-age-of-book-series{ --cc-highlight-accent: rgba(80,220,125,.88); }
.card .cc-highlight-exclusive{ --cc-highlight-accent: rgba(95,238,218,.86); }
.card .cc-highlight-pack-odds{ --cc-highlight-accent: rgba(255,214,120,.86); }
.card .cc-highlight-set-run{ --cc-highlight-accent: rgba(190,211,255,.88); }
.card .cc-highlight-card-stock{ --cc-highlight-accent: rgba(180,188,205,.88); }
.card .cc-highlight-ip{ --cc-highlight-accent: rgba(210,203,255,.86); }

.card .cc-highlight-total-comic-cuts-for-issue .cc-highlight-value{
  color: rgba(255,232,180,.98) !important;
}
.card .cc-highlight-age-of-book-series .cc-highlight-value{
  color: rgba(205,255,216,.98) !important;
}

/* === SOURCE: 035-comic-cut-nav-text-underline-style.css === */
/* Back to Set / Back to My Collection + Next Comic Cut: match the text-link tab feel. */
.card .comic-cut-nav.is-visible{
  align-items:center !important;
}

.card .comic-cut-nav-btn,
.card .comic-cut-nav-btn:first-child,
.card .comic-cut-nav-btn:last-child{
  appearance:none !important;
  -webkit-appearance:none !important;
  width:auto !important;
  min-height:0 !important;
  padding:0 4px 7px !important;
  border:0 !important;
  border-bottom:1px solid transparent !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:rgba(255,255,255,.92) !important;
  font-size:13px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  letter-spacing:.01em !important;
  text-transform:none !important;
  cursor:pointer !important;
  transition:border-bottom-color .18s ease, color .18s ease, opacity .18s ease !important;
}

.card .comic-cut-nav-btn:hover,
.card .comic-cut-nav-btn:active,
.card .comic-cut-nav-btn:focus-visible{
  background:transparent !important;
  border-bottom-color:#ffffff !important;
  color:#ffffff !important;
  box-shadow:none !important;
  transform:none !important;
}

.card .comic-cut-nav-btn:focus-visible{
  outline:none !important;
}

.card .comic-cut-nav-btn[disabled],
.card .comic-cut-nav-btn:disabled{
  opacity:.38 !important;
  cursor:default !important;
  pointer-events:none !important;
  border-bottom-color:transparent !important;
}

@media (min-width:901px){
  .card .comic-cut-nav.is-visible{
    display:grid !important;
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr) !important;
    gap:12px !important;
    justify-items:stretch !important;
  }
  .card .comic-cut-nav-btn:first-child{
    justify-self:start !important;
    text-align:left !important;
    justify-content:flex-start !important;
  }
  .card .comic-cut-nav-btn:last-child{
    justify-self:end !important;
    text-align:right !important;
    justify-content:flex-end !important;
  }
}

@media (min-width:781px) and (max-width:900px){
  .card .comic-cut-nav.is-visible{
    display:flex !important;
    justify-content:space-between !important;
    gap:14px !important;
  }
  .card .comic-cut-nav-btn:first-child{
    justify-content:flex-start !important;
    text-align:left !important;
  }
  .card .comic-cut-nav-btn:last-child{
    justify-content:flex-end !important;
    text-align:right !important;
  }
}

@media (max-width:780px){
  .card .comic-cut-nav.is-visible{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
    gap:14px !important;
    margin:2px 0 12px !important;
    padding:0 !important;
  }
  .card .comic-cut-nav-btn,
  .card .comic-cut-nav-btn:first-child,
  .card .comic-cut-nav-btn:last-child{
    flex:0 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    font-size:13px !important;
    min-height:0 !important;
    padding:0 2px 7px !important;
  }
  .card .comic-cut-nav-btn:first-child{
    justify-content:flex-start !important;
    text-align:left !important;
  }
  .card .comic-cut-nav-btn:last-child{
    margin-left:auto !important;
    justify-content:flex-end !important;
    text-align:right !important;
  }
}

/* === SOURCE: 036-comic-cut-top-icon-nav-style.css === */
/* Top comic-cut navigation: icon buttons under Browse List + logged-in status counters. */
#result > .comic-cut-nav.is-visible{
  width:100%;
  max-width:900px;
  margin:6px auto 10px;
  display:grid !important;
  grid-template-columns:44px minmax(0,1fr) 44px;
  align-items:center;
  gap:10px;
  padding:0 2px;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
#result > .comic-cut-nav .comic-cut-nav-icon-btn{
  appearance:none;
  -webkit-appearance:none;
  width:44px;
  height:40px;
  min-height:40px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--text);
  box-shadow:none !important;
  cursor:pointer;
  position:relative;
  opacity:.94;
  transition:opacity .18s ease, transform .18s ease, color .18s ease;
}
#result > .comic-cut-nav .comic-cut-nav-icon-btn::after{
  content:"";
  position:absolute;
  left:9px;
  right:9px;
  bottom:3px;
  height:1px;
  background:#fff;
  transform:scaleX(0);
  transform-origin:center;
  opacity:0;
  transition:transform .18s ease, opacity .18s ease;
}
#result > .comic-cut-nav .comic-cut-nav-icon-btn:hover,
#result > .comic-cut-nav .comic-cut-nav-icon-btn:focus-visible{
  color:#fff;
  opacity:1;
  transform:translateY(-1px);
}
#result > .comic-cut-nav .comic-cut-nav-icon-btn:hover::after,
#result > .comic-cut-nav .comic-cut-nav-icon-btn:focus-visible::after{
  opacity:1;
  transform:scaleX(1);
}
#result > .comic-cut-nav .comic-cut-nav-icon-btn:active{
  transform:translateY(0);
}
#result > .comic-cut-nav .comic-cut-nav-icon-btn[disabled],
#result > .comic-cut-nav .comic-cut-nav-icon-btn:disabled{
  opacity:.25;
  cursor:default;
  pointer-events:none;
}
#result > .comic-cut-nav .comic-cut-nav-icon-btn .material-symbols-outlined{
  font-size:30px;
  line-height:1;
}

/* Keep nav arrows pinned to the outside columns even when the logged-in counters are hidden. */
#backToSetBtn{
  grid-column:1;
  justify-self:start;
}
#comicCutNavCounters{
  grid-column:2;
  justify-self:center;
}
#nextComicCutBtn{
  grid-column:3;
  justify-self:end;
}
.comic-cut-nav-counters{
  min-width:0;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.comic-cut-nav-counters[hidden]{
  display:none !important;
}
.comic-cut-nav-counter{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:30px;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.11);
  background:rgba(255,255,255,.035);
  color:rgba(255,255,255,.88);
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  line-height:1;
  text-transform:uppercase;
  white-space:nowrap;
}
.comic-cut-nav-counter strong{
  color:#fff;
  font-size:12px;
  font-weight:900;
}
.comic-cut-nav-counter.on-the-hunt{
  border-color:rgba(87,168,255,.30);
  background:rgba(87,168,255,.10);
}
.comic-cut-nav-counter.trade-sale{
  border-color:rgba(255,146,68,.32);
  background:rgba(255,146,68,.10);
}
.comic-cut-nav-counter.pc{
  border-color:rgba(232,121,79,.42);
  background:rgba(232,121,79,.12);
}
.comic-cut-nav-counter.total-cuts{
  border-color:rgba(154,139,255,.38);
  background:rgba(154,139,255,.12);
}
.comic-cut-nav-counter-mark{
  color:#fff;
  font-size:13px;
  font-weight:900;
  line-height:1;
}
.comic-cut-nav-counter.key-issue{
  border-color:rgba(255,120,220,.48);
  background:
    linear-gradient(rgba(15,6,35,.74), rgba(15,6,35,.74)) padding-box,
    linear-gradient(90deg, #ff4fd8 0%, #ffd84f 28%, #5cff8d 52%, #4fd8ff 76%, #b86cff 100%) border-box;
  box-shadow: 0 0 18px rgba(184,108,255,.16);
}
.comic-cut-nav-counter.key-issue .comic-cut-nav-counter-icon,
.comic-cut-nav-counter.key-issue span{
  background: linear-gradient(90deg, #ff4fd8 0%, #ffd84f 28%, #5cff8d 52%, #4fd8ff 76%, #b86cff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  text-shadow: 0 0 14px rgba(184,108,255,.20);
}
.comic-cut-nav-counter.rare-issue{
  border-color:rgba(255,214,0,.42);
  background:rgba(255,214,0,.12);
}
.comic-cut-nav-counter-icon{
  font-size:15px;
  line-height:1;
}
@media (max-width:780px){
  #result > .comic-cut-nav.is-visible{
    max-width:900px;
    grid-template-columns:42px minmax(0,1fr) 42px;
    margin:4px auto 10px;
    gap:8px;
    padding:0 4px;
  }
  #result > .comic-cut-nav .comic-cut-nav-icon-btn{
    width:42px;
    height:38px;
    min-height:38px;
  }
  #result > .comic-cut-nav .comic-cut-nav-icon-btn .material-symbols-outlined{
    font-size:29px;
  }
  .comic-cut-nav-counters{
    gap:5px;
  }
  .comic-cut-nav-counter{
    min-height:26px;
    padding:5px 6px;
    gap:4px;
    font-size:8px;
    letter-spacing:.04em;
  }
  .comic-cut-nav-counter strong{
    font-size:10px;
  }
}

/* === SOURCE: 037-comic-cut-top-icon-nav-nonuser-spacing-fix.css === */
/* Keep top comic-cut nav spacing identical for logged-in and logged-out users. */
#comicCutNav.comic-cut-nav.is-visible{
  width:100%;
  max-width:900px;
  margin:6px auto 10px;
  display:grid !important;
  grid-template-columns:44px minmax(0,1fr) 44px;
  align-items:center;
  gap:10px;
  padding:0 2px;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
#comicCutNav #backToSetBtn{ grid-column:1; justify-self:start; }
#comicCutNav #comicCutNavCounters{ grid-column:2; justify-self:center; }
#comicCutNav #nextComicCutBtn{ grid-column:3; justify-self:end; }
#comicCutNav .comic-cut-nav-counters[hidden]{
  display:flex !important;
}
#comicCutNav .comic-cut-nav-counters.is-empty{
  display:flex !important;
  visibility:hidden;
  pointer-events:none;
  min-height:30px;
}
#comicCutNav .comic-cut-nav-counters.is-empty .comic-cut-nav-counter{
  visibility:hidden;
}
@media (max-width:780px){
  #comicCutNav.comic-cut-nav.is-visible{
    grid-template-columns:42px minmax(0,1fr) 42px;
    margin:4px auto 10px;
    gap:8px;
    padding:0 4px;
  }
  #comicCutNav .comic-cut-nav-counters.is-empty{
    min-height:26px;
  }
}

/* === SOURCE: 038-desktop-next-random-speed-polish.css === */
/* Desktop-only responsiveness polish for Next Comic Cut + Random Card.
   Keeps mobile behavior and layout untouched. */
@media (min-width: 821px) and (hover: hover) and (pointer: fine){
  #myCollectionBtn,
  #nextComicCutBtn{
    touch-action: manipulation;
  }
  #nextComicCutBtn:active,
  #myCollectionBtn:active,
  .altthumb:active,
  .mini-row:active,
  .mini-popover-view:active{
    transform: none !important;
  }
  .altthumb,
  .mini-popover-view{
    touch-action: manipulation;
  }
}

/* === SOURCE: 039-safe-button-response-speed-lift.css === */
/* Safe responsiveness lift for high-use buttons.
   Keeps layout and image rendering unchanged; only removes small tap/click delays
   and reduces expensive press animations on the controls that open/switch views. */
.random-card-day-btn,
.altthumb,
.mini-row,
.mini-popover-view,
.mc-issue-overlay-btn,
.comic-cut-nav-btn,
.comic-cut-nav-icon-btn,
.zoom-popup-btn,
.zoom-popup-close,
#nextComicCutBtn,
#backToSetBtn,
#myCollectionBtn,
.auth-btn,
.icon-btn{
  touch-action: manipulation;
}

/* These controls feel faster when their press state does not trigger layout/composite work. */
.random-card-day-btn:active,
.altthumb:active,
.mini-row:active,
.mini-popover-view:active,
.mc-issue-overlay-btn:active,
.comic-cut-nav-btn:active,
.comic-cut-nav-icon-btn:active,
.zoom-popup-btn:active,
.zoom-popup-close:active,
#nextComicCutBtn:active,
#backToSetBtn:active{
  transform: none !important;
}

/* Shorten only interaction transitions on the frequently tapped open/view controls. */
.random-card-day-btn,
.altthumb,
.mini-row,
.mini-popover-view,
.mc-issue-overlay-btn,
.comic-cut-nav-btn,
.comic-cut-nav-icon-btn,
.zoom-popup-btn,
.zoom-popup-close{
  transition-duration: .08s !important;
}

/* Mobile gets the biggest benefit from avoiding hover/active compositing on tap. */
@media (hover: none), (pointer: coarse){
  .random-card-day-btn,
  .altthumb,
  .mini-row,
  .mini-popover-view,
  .mc-issue-overlay-btn,
  .comic-cut-nav-btn,
  .comic-cut-nav-icon-btn,
  .zoom-popup-btn,
  .zoom-popup-close{
    transition: none !important;
    -webkit-tap-highlight-color: transparent;
  }
}

/* === SOURCE: 040-my-collection-fast-view-open-v2.css === */
/* Faster My Collection View / Full View interactions.
   Keeps visuals intact; avoids extra active-state work on the controls that open heavy views. */
.mini-popover-view,
.mc-issue-overlay-btn,
.thumb .icon-btn,
.auth-btn{
  touch-action: manipulation;
}
@media (hover: none), (pointer: coarse){
  .mini-popover-view,
  .mc-issue-overlay-btn,
  .thumb .icon-btn{
    transition: none !important;
  }
}

/* === SOURCE: 041-mobile-gallery-open-button-highlight-fix.css === */
/* Mobile-only: prevent the Open Image Gallery button from showing a temporary
   focus/active border after tapping thumbnails. Keeps desktop hover/focus intact. */
@media (hover: none), (pointer: coarse){
  .thumb .gallery-open-btn,
  .thumb .gallery-open-btn:hover,
  .thumb .gallery-open-btn:active,
  .thumb .gallery-open-btn:focus,
  .thumb .gallery-open-btn:focus-visible{
    border-color: var(--border) !important;
    background: var(--panel) !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .thumb .gallery-open-btn.is-active{
    border-color: var(--border) !important;
    background: var(--panel) !important;
    color: var(--text) !important;
  }
}

/* === SOURCE: 042-ccc-gallery-mobile-pinch-zoom-block.css === */
/* Block native mobile pinch/zoom gestures while the open image gallery is active. */
.ccc-gallery-overlay,
.ccc-gallery-modal,
.ccc-gallery-stage-wrap,
.ccc-gallery-stage,
.ccc-gallery-stage img{
  touch-action: none !important;
  -ms-touch-action: none !important;
  overscroll-behavior: contain !important;
}

.ccc-gallery-thumbs,
.ccc-gallery-thumb{
  touch-action: pan-x !important;
  -ms-touch-action: pan-x !important;
}

/* === SOURCE: 043-trade-page-price-guide-dropdown-patch.css === */
/* Trade page dropdowns: Price Guide-style searchable pickers.
   Desktop = compact floating panel. Mobile = true body-level fly-up sheet. */
.trade-page-select.trade-page-select--native-hidden{
  position:absolute !important;
  opacity:0 !important;
  pointer-events:none !important;
  width:1px !important;
  height:1px !important;
  margin:0 !important;
  padding:0 !important;
}
.trade-page-picker{
  position:relative;
  width:100%;
  min-width:0;
  z-index:5;
}
.trade-page-picker.is-open{ z-index:10020; }
.trade-page-picker-trigger{
  width:100%;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:14px;
  background:rgba(255,255,255,.04);
  color:var(--text);
  cursor:pointer;
  font-size:13px;
  font-weight:800;
  text-align:left;
  box-shadow:none;
}
.trade-page-picker-trigger:hover,
.trade-page-picker-trigger[aria-expanded="true"]{
  border-color:rgba(154,139,255,.55);
  background:rgba(154,139,255,.16);
}
.trade-page-picker-trigger:focus-visible{
  border-color:var(--focus);
  box-shadow:0 0 0 3px var(--focus-ring), var(--shadow);
  outline:none;
}
.trade-page-picker-trigger:disabled{ opacity:.55; cursor:not-allowed; }
.trade-page-picker-trigger-text{
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.trade-page-picker-trigger .material-symbols-outlined{ flex:0 0 auto; font-size:20px; }

.trade-page-picker-overlay{
  position:fixed;
  inset:0;
  z-index:10000;
  display:none;
  background:rgba(0,0,0,.52);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}
.trade-page-picker-overlay.open{ display:block; }

.trade-page-picker-panel{
  position:fixed;
  left:12px;
  top:120px;
  width:min(420px, calc(100vw - 24px));
  height:auto;
  max-height:260px;
  display:none;
  grid-template-rows:auto minmax(0,1fr);
  gap:6px;
  padding:8px;
  border:1px solid var(--border);
  border-radius:16px;
  background:linear-gradient(180deg,var(--panel) 0%,var(--panel-2) 100%);
  box-shadow:var(--shadow);
  overflow:hidden;
  z-index:10010;
  overscroll-behavior:contain;
}
.trade-page-picker-panel.open{ display:grid; }
.trade-page-picker-panel.is-mobile-sheet{ display:none; }
.trade-page-picker-panel.is-mobile-sheet.open{ display:grid; }

.trade-page-picker-sheet-title{
  display:none;
  color:var(--muted);
  font-size:11px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  padding:0 2px 1px;
}
.trade-page-picker-search-wrap{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 11px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:linear-gradient(180deg,var(--panel) 0%,var(--panel-2) 100%);
  box-shadow:0 10px 28px rgba(0,0,0,.18);
}
.trade-page-picker-search-wrap .material-symbols-outlined{ font-size:18px; color:var(--muted); }
.trade-page-picker-search{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font-size:16px;
  font-weight:700;
}
.trade-page-picker-search::placeholder{ color:var(--muted); opacity:.82; }
.trade-page-picker-options{
  min-height:0;
  overflow:auto;
  display:grid;
  align-content:start;
  gap:4px;
  padding-right:2px;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  touch-action:pan-y;
}
.trade-page-picker-option{
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--text);
  cursor:pointer;
  font-size:13px;
  font-weight:700;
  text-align:left;
}
.trade-page-picker-option:hover,
.trade-page-picker-option[aria-selected="true"]{ background:rgba(255,255,255,.08); }
.trade-page-picker-option .material-symbols-outlined{ font-size:18px; opacity:.85; flex:0 0 auto; }
.trade-page-picker-option.has-card-preview{
  min-height:64px;
  justify-content:flex-start;
  gap:10px;
  padding:8px 10px;
}
.trade-page-picker-option-preview-img,
.trade-page-picker-option-preview-ph{
  width:42px;
  flex:0 0 42px;
  aspect-ratio:3/4;
  object-fit:contain;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
}
.trade-page-picker-option-preview-ph{
  opacity:.45;
  background:repeating-linear-gradient(45deg, rgba(255,255,255,.08), rgba(255,255,255,.08) 6px, rgba(255,255,255,.03) 6px, rgba(255,255,255,.03) 12px);
}
.trade-page-picker-option-preview-copy{
  min-width:0;
  display:grid;
  gap:3px;
  flex:1 1 auto;
}
.trade-page-picker-option-preview-line1,
.trade-page-picker-option-preview-line2{
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  line-height:1.2;
}
.trade-page-picker-option-preview-line1{
  color:var(--text);
  font-size:13px;
  font-weight:900;
}
.trade-page-picker-option-preview-line2{
  color:var(--muted);
  font-size:12px;
  font-weight:700;
}
.trade-page-picker-option.has-card-preview .material-symbols-outlined{
  margin-left:auto;
}
@media (min-width:781px){
  .trade-page-picker-option-preview-line1,
  .trade-page-picker-option-preview-line2{
    overflow:visible;
    white-space:normal;
    text-overflow:clip;
  }
}
.trade-page-picker-empty{ padding:11px 10px; color:var(--muted); font-size:13px; }
body.trade-page-picker-open{ overflow-x:hidden; }

/* Mobile sheet event-layer fix: keep the original select trigger behind the sheet/backdrop. */
@media (max-width:780px){
  .trade-page-picker.is-open{ z-index:5 !important; }
  .trade-page-picker-overlay.open{
    z-index:10020 !important;
    pointer-events:auto !important;
    touch-action:none !important;
  }
  .trade-page-picker-panel.is-mobile-sheet{
    z-index:10030 !important;
  }
}

@media (max-width:780px){
  html.trade-page-picker-lock,
  body.trade-page-picker-lock{
    overflow:hidden !important;
    overscroll-behavior:none !important;
  }
  .trade-page-picker-overlay.open{ display:block; }
  .trade-page-picker-panel.is-mobile-sheet{
    left:0 !important;
    right:0 !important;
    top:auto !important;
    bottom:var(--trade-vv-bottom, 0px) !important;
    width:100vw !important;
    max-width:none !important;
    height:min(72dvh, 560px) !important;
    height:min(calc(var(--trade-vvh, 100vh) * .72), 560px) !important;
    max-height:calc(var(--trade-vvh, 100vh) - 18px - env(safe-area-inset-top, 0px)) !important;
    padding:22px 12px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    border-left:0 !important;
    border-right:0 !important;
    border-bottom:0 !important;
    border-radius:22px 22px 0 0 !important;
    grid-template-rows:auto auto minmax(0,1fr) !important;
    box-shadow:0 -20px 60px rgba(0,0,0,.62) !important;
    transform:translate3d(0,100%,0);
    opacity:0;
    transition:transform .24s cubic-bezier(.2,.8,.2,1), opacity .18s ease;
    will-change:transform;
    z-index:10030 !important;
  }
  .trade-page-picker-panel.is-mobile-sheet.open{
    transform:translate3d(0,0,0);
    opacity:1;
  }
  .trade-page-picker-panel.is-mobile-sheet::before{
    content:"";
    position:absolute;
    top:8px;
    left:50%;
    transform:translateX(-50%);
    width:46px;
    height:4px;
    border-radius:999px;
    background:rgba(255,255,255,.35);
  }
  .trade-page-picker-sheet-title{ display:block; }
  .trade-page-picker-search-wrap{
    position:sticky;
    top:0;
    z-index:3;
    margin-top:0;
  }
  .trade-page-picker-options{
    min-height:0;
    max-height:none;
    overflow-y:auto;
    padding:2px 2px calc(8px + env(safe-area-inset-bottom, 0px));
  }
  .trade-page-picker-option{
    min-height:48px;
    font-size:14px;
    line-height:1.25;
    border-radius:12px;
  }
}

/* === SOURCE: 044-ccc-global-mobile-picker-sheet-styles.css === */
/* Shared real-phone mobile picker for Add/Edit Card, Archive, Price Guide, and Trade-style dropdowns. */
.ccc-mobile-picker-overlay{
  position:fixed;
  inset:0;
  z-index:12000;
  display:none;
  background:rgba(0,0,0,.52);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  touch-action:none;
}
.ccc-mobile-picker-overlay.open{ display:block; }
.ccc-mobile-picker-sheet{
  position:fixed;
  left:0;
  right:0;
  /* Keep the fly-up's outer geometry stable while the software keyboard opens.
     JS snapshots these values before focus. The keyboard is handled inside the
     scrollable content instead of shrinking/moving the entire sheet. */
  top:var(--ccc-picker-sheet-top, auto);
  bottom:var(--ccc-picker-sheet-bottom, 0px);
  z-index:12010;
  width:100vw;
  height:var(--ccc-picker-sheet-height, min(72dvh, 560px));
  max-height:none;
  display:none;
  grid-template-rows:auto auto minmax(0,1fr);
  gap:8px;
  padding:22px 12px calc(12px + env(safe-area-inset-bottom, 0px));
  border:1px solid var(--border);
  border-left:0;
  border-right:0;
  border-bottom:0;
  border-radius:22px 22px 0 0;
  background:linear-gradient(180deg,var(--panel) 0%,var(--panel-2) 100%);
  box-shadow:0 -20px 60px rgba(0,0,0,.62);
  overflow:hidden;
  transform:translate3d(0,100%,0);
  opacity:0;
  transition:transform .24s cubic-bezier(.2,.8,.2,1), opacity .18s ease;
  will-change:transform;
}
.ccc-mobile-picker-sheet.open{
  display:grid;
  transform:translate3d(0,0,0);
  opacity:1;
}
.ccc-mobile-picker-sheet::before{
  content:"";
  position:absolute;
  top:8px;
  left:50%;
  transform:translateX(-50%);
  width:46px;
  height:4px;
  border-radius:999px;
  background:rgba(255,255,255,.35);
}
.ccc-mobile-picker-title{
  color:var(--muted);
  font-size:11px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  padding:0 2px 1px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.ccc-mobile-picker-search-wrap{
  position:sticky;
  top:0;
  z-index:3;
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 11px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:linear-gradient(180deg,var(--panel) 0%,var(--panel-2) 100%);
  box-shadow:0 10px 28px rgba(0,0,0,.18);
}
.ccc-mobile-picker-search-wrap .material-symbols-outlined{ font-size:18px; color:var(--muted); }
.ccc-mobile-picker-search{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font-size:16px;
  font-weight:700;
}
.ccc-mobile-picker-search::placeholder{ color:var(--muted); opacity:.82; }
.ccc-mobile-picker-options{
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  display:grid;
  align-content:start;
  gap:4px;
  padding:2px 2px calc(8px + env(safe-area-inset-bottom, 0px) + var(--ccc-picker-keyboard-inset, 0px));
  scroll-padding-bottom:calc(8px + env(safe-area-inset-bottom, 0px) + var(--ccc-picker-keyboard-inset, 0px));
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  touch-action:pan-y;
}
.ccc-mobile-picker-option{
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--text);
  cursor:pointer;
  font-size:13px;
  font-weight:700;
  text-align:left;
}
.ccc-mobile-picker-option:active,
.ccc-mobile-picker-option[aria-selected="true"]{ background:rgba(255,255,255,.08); }
.ccc-mobile-picker-option-label{ min-width:0; overflow-wrap:anywhere; }
.ccc-mobile-picker-option-meta{
  flex:0 0 auto;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}
.ccc-mobile-picker-option .material-symbols-outlined{ font-size:18px; opacity:.85; flex:0 0 auto; }
.ccc-mobile-picker-empty{ padding:11px 10px; color:var(--muted); font-size:13px; }
html.ccc-mobile-picker-lock,
body.ccc-mobile-picker-lock{
  overflow:hidden !important;
  overscroll-behavior:none !important;
}
@media (min-width:781px){
  .ccc-mobile-picker-overlay,
  .ccc-mobile-picker-sheet{ display:none !important; }
}

/* === SOURCE: 045-ccc-dropdown-deselect-buttons-patch.css === */
/* Deselect buttons for Trade page and Comic Cut Archive dropdown rows. */
.trade-page-field.has-picker-clear{
  grid-template-columns:minmax(0, 1fr) 44px;
  align-items:start;
  gap:6px 8px;
}
.trade-page-field.has-picker-clear > label{
  grid-column:1 / -1;
}
.trade-page-field.has-picker-clear .trade-page-picker{
  grid-column:1;
}
.trade-page-field.has-picker-clear .ccc-dropdown-deselect-btn{
  grid-column:2;
}
.archive-series-row.has-picker-clear{
  display:flex;
  align-items:flex-start;
  gap:8px;
}
.archive-series-row.has-picker-clear .uniform-dd{
  flex:1 1 auto;
  min-width:0;
}
.ccc-dropdown-deselect-btn{
  min-height:44px;
  width:44px;
  flex:0 0 44px;
  padding:0;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  color:var(--text);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  border-radius:0;
  box-shadow:none;
}
.ccc-dropdown-deselect-btn .material-symbols-outlined{
  font-size:22px;
  line-height:1;
}
.ccc-dropdown-deselect-btn:hover:not(:disabled){
  border-color:rgba(255,255,255,.35);
  background:rgba(255,255,255,.08);
}
.ccc-dropdown-deselect-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}
@media (max-width:560px){
  .trade-page-field.has-picker-clear,
  .archive-series-row.has-picker-clear{
    gap:7px;
  }
  .ccc-dropdown-deselect-btn{
    width:44px;
    flex-basis:44px;
    padding:0;
  }
}

/* === SOURCE: 046-master-add-set-styles.css === */
/* ===== Master Database Add Set page ===== */
.master-add-set-wrap{
  width:100%;
  max-width:980px;
  margin:0 auto;
  display:grid;
  gap:14px;
}
.master-add-set-hero{
  width:100%;
  border:1px solid rgba(154,139,255,.34);
  background:linear-gradient(180deg, rgba(154,139,255,.13), rgba(255,255,255,.025));
  box-shadow:0 18px 44px rgba(0,0,0,.24);
  padding:16px;
  display:grid;
  gap:10px;
}
.master-add-set-kicker{color:var(--muted);font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;}
.master-add-set-title{margin:0;font-size:clamp(24px,4vw,40px);line-height:1.05;font-weight:900;}
.master-add-set-note{color:var(--muted);font-size:13px;line-height:1.5;}
.master-add-set-box,
.master-add-set-card-row{
  border:1px solid var(--border);
  background:rgba(255,255,255,.035);
  padding:14px;
  display:grid;
  gap:12px;
}
.master-add-set-box h3,
.master-add-set-list h3{
  margin:0;
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.master-add-set-fields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 12px;
}
.master-add-set-field{display:grid;gap:6px;min-width:0;}
.master-add-set-field label{color:var(--muted);font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;}
.master-add-set-control{
  width:100%;
  min-height:42px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.18);
  color:var(--text);
  padding:10px 12px;
  outline:none;
  font-size:14px;
}
.master-add-set-control option{color:#000;}
.master-add-set-control:focus-visible{border-color:var(--focus);box-shadow:0 0 0 3px var(--focus-ring), var(--shadow);}
.master-add-set-actions{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;}
.master-add-set-bulk{grid-column:1 / -1;display:grid;gap:10px;padding:12px;border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.12);}
.master-add-set-bulk-head{display:grid;gap:4px;}
.master-add-set-bulk-title{font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;}
.master-add-set-bulk-note{color:var(--muted);font-size:12px;line-height:1.45;}
.master-add-set-bulk-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px;}
.master-add-set-bulk textarea.master-add-set-control{min-height:92px;resize:vertical;line-height:1.4;}
.master-add-set-status{color:var(--muted);font-size:13px;line-height:1.45;}
.master-add-set-status.ok{color:#9be6b5;}.master-add-set-status.err{color:#ff9aa2;}
.master-set-bulk-edit-box{
  border:1px solid rgba(154,139,255,.34);
  background:linear-gradient(180deg, rgba(154,139,255,.10), rgba(255,255,255,.025));
  padding:14px;
  display:grid;
  gap:12px;
}
.master-set-bulk-edit-note{color:var(--muted);font-size:12px;line-height:1.45;}
.master-set-bulk-edit-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px;}
.master-set-bulk-edit-actions{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;}
.master-add-set-list{display:grid;gap:12px;}
.master-add-set-card-row{grid-template-columns:minmax(140px,190px) minmax(0,1fr);align-items:start;}
.master-add-set-images{display:grid;gap:12px;}
.master-add-set-card-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px;}
.master-add-set-card-head{grid-column:1 / -1;display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;}
@media (max-width:780px){
  .master-add-set-fields,.master-add-set-card-fields,.master-add-set-bulk-grid,.master-set-bulk-edit-fields{grid-template-columns:1fr;}
  .master-add-set-card-row{grid-template-columns:1fr;}
}

/* === SOURCE: 047-fausto-desktop-card-reflow-2026-06-12.css === */
/* Final scoped patch: desktop detail-card button/notification/thumbnail layout. */
.card .comic-cut-card-action-stack{
  width:100%;
  display:grid;
  gap:8px;
  margin-top:8px;
}
.card .comic-cut-card-counter-slot{
  width:100%;
  min-height:0;
}
.card .comic-cut-card-counter-slot .comic-cut-nav-counters{
  width:100%;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin:0;
}
.card .comic-cut-card-counter-slot .comic-cut-nav-counters[hidden]{ display:none !important; }
.card .comic-cut-main-actions{
  width:100%;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:8px !important;
  margin-top:0 !important;
}
.card .comic-cut-main-actions[hidden],
.card .comic-cut-main-actions.comic-cut-main-actions--logged-out-hidden{
  display:none !important;
}
.card .comic-cut-main-actions .icon-btn{
  width:100%;
  min-width:0;
  min-height:44px;
  height:44px;
  padding:0 !important;
  border-radius:12px;
}
.card .comic-cut-card-action-stack > .comic-cut-nav.is-visible{
  width:100% !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:8px !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-counters{ display:none !important; }
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:first-child,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:last-child{
  width:100% !important;
  min-width:0 !important;
  min-height:44px !important;
  height:44px !important;
  padding:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  border:1px solid var(--border) !important;
  border-radius:12px !important;
  background:var(--panel) !important;
  color:var(--text) !important;
  box-shadow:none !important;
  flex:none !important;
}
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:hover,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:focus-visible{
  border-color:rgba(255,255,255,.6) !important;
  background:rgba(255,255,255,.08) !important;
  text-decoration:none !important;
}
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-icon-btn::after{ display:none !important; }
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn .material-symbols-outlined{ font-size:22px !important; }
.card .altthumbs-wrap--master{
  margin-top:10px;
}
.card .altthumbs-wrap--owners{
  width:100%;
  max-height:260px;
  margin:12px 0 0;
}
.card .altthumbs-wrap--owners .altthumbs{
  grid-template-columns:repeat(6, minmax(0, 1fr));
}
@media (min-width:901px){
  .card .altthumbs-wrap--owners{
    grid-column:1 / -1;
  }
}
@media (min-width:781px) and (max-width:900px){
  .card .altthumbs-wrap--owners .altthumbs{ grid-template-columns:repeat(5, minmax(0, 1fr)); }
}
@media (max-width:780px){
  .card .comic-cut-card-action-stack{ gap:8px; }
  .card .comic-cut-main-actions,
  .card .comic-cut-card-action-stack > .comic-cut-nav.is-visible{
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  }
  .card .comic-cut-card-action-stack > .comic-cut-nav.is-visible{
    grid-template-columns:1fr !important;
  }
  .card .comic-cut-main-actions .icon-btn,
  .card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn,
  .card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:first-child,
  .card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:last-child{
    height:40px !important;
    min-height:40px !important;
  }
  .card .altthumbs-wrap--owners{
    grid-column:1 / -1;
    max-height:230px;
  }
  .card .altthumbs-wrap--owners .altthumbs{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

/* === SOURCE: 048-mobile-add-edit-modal-safe-fix.css === */
/* Mobile-safe Add/Edit modal positioning: avoids fixed centered modals being clipped
   when mobile browser chrome or the keyboard changes the visible viewport. */
@media (max-width: 780px){
  #addCardModal,
  #editCardModal{
    left: max(10px, env(safe-area-inset-left, 0px)) !important;
    right: max(10px, env(safe-area-inset-right, 0px)) !important;
    top: max(10px, env(safe-area-inset-top, 0px)) !important;
    bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important;

    width: auto !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;

    transform: none !important;
    margin: 0 !important;

    display: none;
    flex-direction: column;
  }

  #addCardModal.open,
  #editCardModal.open{
    display: flex !important;
  }

  #addCardModal .modal-body,
  #editCardModal .modal-body{
    min-height: 0 !important;
    flex: 1 1 auto !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  #addCardModal .modal-footer,
  #editCardModal .modal-footer{
    flex: 0 0 auto !important;
    flex-wrap: wrap !important;
  }
}

/* === SOURCE: 049-desktop-owner-thumb-strip-above-pills.css === */
@media (min-width:781px){
  .card .card-main{
    min-width:0;
    display:flex;
    flex-direction:column;
  }
  .card .card-main > .altthumbs-wrap--owners{
    order:-1;
    width:100%;
    max-height:none !important;
    margin:0 0 12px 0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x;
    padding:8px !important;
  }
  .card .card-main > .altthumbs-wrap--owners .altthumbs{
    display:flex !important;
    flex-wrap:nowrap !important;
    grid-template-columns:none !important;
    gap:8px !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    width:max-content;
    min-width:100%;
  }
  .card .card-main > .altthumbs-wrap--owners .altthumb,
  .card .card-main > .altthumbs-wrap--owners .altthumb:hover,
  .card .card-main > .altthumbs-wrap--owners .altthumb:active,
  .card .card-main > .altthumbs-wrap--owners .altthumb:focus,
  .card .card-main > .altthumbs-wrap--owners .altthumb:focus-visible{
    flex:0 0 72px !important;
    width:72px !important;
    min-width:72px !important;
    max-width:72px !important;
    height:96px !important;
    min-height:96px !important;
    max-height:96px !important;
    padding:2px !important;
    border-radius:7px !important;
  }
  .card .card-main > .altthumbs-wrap--owners .altthumb img{
    width:100% !important;
    height:100% !important;
    aspect-ratio:3 / 4 !important;
    object-fit:contain !important;
    border-radius:5px !important;
  }
  .card .card-main > .altthumbs-wrap--owners .alt-owner-card,
  .card .card-main > .altthumbs-wrap--owners .alt-owner-divider,
  .card .card-main > .altthumbs-wrap--owners .alt-owner-label,
  .card .card-main > .altthumbs-wrap--owners .alt-owner-rule{
    display:none !important;
  }
}

/* === SOURCE: 050-mobile-master-thumb-placement-patch.css === */
@media (max-width:780px){
  .card .card-main > .altthumbs-wrap--master-mobile-placement{
    grid-column:1 / -1 !important;
    width:100% !important;
    max-height:none !important;
    margin:10px 0 0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x;
    padding:8px !important;
    box-sizing:border-box !important;
  }

  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumbs{
    display:flex !important;
    flex-wrap:nowrap !important;
    grid-template-columns:none !important;
    gap:8px !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    width:max-content !important;
    min-width:100% !important;
  }

  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb:hover,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb:active,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb:focus,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb:focus-visible{
    flex:0 0 72px !important;
    width:72px !important;
    min-width:72px !important;
    max-width:72px !important;
    height:96px !important;
    min-height:96px !important;
    max-height:96px !important;
    padding:2px !important;
    border-radius:7px !important;
  }

  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb img{
    width:100% !important;
    height:100% !important;
    aspect-ratio:3 / 4 !important;
    object-fit:contain !important;
    border-radius:5px !important;
  }

  .card .card-main > .altthumbs-wrap--master-mobile-placement .alt-divider,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .alt-owner-card,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .alt-owner-divider,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .alt-owner-label,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .alt-owner-rule{
    display:none !important;
  }
}

/* === SOURCE: 051-pill-order-status-highlights-patch.css === */
@media (min-width:781px){
  .card .pillgrid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* Mobile logged-out pill cleanup: Card Number belongs in Additional Information, not the top pill grid. */
.card .pillgrid .mobile-card-number-pill{ display:none !important; }
/* Collector Status owner rows: status + boxed collector name on one line, no count numbers. */
.cc-highlights-panel .cc-highlight-collector-status .cc-highlight-value{
  display: grid !important;
  gap: 5px !important;
  line-height: 1.3 !important;
}
.cc-status-owner-group{
  display: contents;
}
.cc-status-owner-line{
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  padding: 4px 0;
}
.cc-status-owner-line + .cc-status-owner-line{
  border-top: 1px dashed rgba(255,255,255,.09);
}
.cc-status-owner-title{
  flex: 0 0 auto;
  color: rgba(238,240,246,.74);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.cc-status-owner-name{
  flex: 0 1 auto;
  max-width: 100%;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  padding: 4px 7px;
  border: 1px solid rgba(255,255,255,.13);
  background: rgba(255,255,255,.045);
  color: rgba(238,240,246,.92);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.15;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


/* Collector Status highlight stays neutral at rest and on hover. */
.cc-highlights-panel .cc-highlight-collector-status,
.cc-highlights-panel .cc-highlight-collector-status:hover,
.cc-highlights-panel .cc-highlight-collector-status:active,
.cc-highlights-panel .cc-highlight-on-the-hunt,
.cc-highlights-panel .cc-highlight-ft-fs,
.cc-highlights-panel .cc-highlight-pc-collector-s,
.cc-highlights-panel .cc-highlight-on-the-hunt:hover,
.cc-highlights-panel .cc-highlight-ft-fs:hover,
.cc-highlights-panel .cc-highlight-pc-collector-s:hover,
.cc-highlights-panel .cc-highlight-on-the-hunt:active,
.cc-highlights-panel .cc-highlight-ft-fs:active,
.cc-highlights-panel .cc-highlight-pc-collector-s:active{
  border-color: transparent !important;
  border-bottom-color: rgba(255,255,255,.080) !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

/* === SOURCE: 052-owner-divider-white-visibility-patch.css === */
/* Make owner group separator lines in the thumbnail window clearly visible. */
.card .altthumbs .alt-owner-divider .line,
.card .alt-owner-rule{
  background: #ffffff !important;
  opacity: 1 !important;
  box-shadow: 0 0 8px rgba(255,255,255,.35);
}

/* === SOURCE: 053-hide-main-page-borders-patch.css === */
/* Hide the dashed/dotted main-page placeholder border */
#result .empty{
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Keep the historical border/background cleanup on mobile only.
   Desktop Random Card of the Day now intentionally uses a glass panel. */
@media (max-width: 780px){
  #randomCardDayWrap,
  .random-card-day-wrap,
  .random-card-day-btn,
  .random-card-day-empty{
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .random-card-day-media{
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

/* Remove the dashed magnifier outline too, in case this is the dotted line appearing on the main page */
.page-magnifier{
  outline: none !important;
}

/* === SOURCE: 054-ccc-mobile-performance-patch-css.css === */
/* MOBILE PERFORMANCE PATCH: mobile-only paint reductions. Desktop glass styling is unchanged. */
@media (max-width: 820px), (hover: none) and (pointer: coarse) {
  .topbar,
  .card,
  .ac,
  .flyout-overlay,
  .flyout,
  .modal-overlay,
  .modal,
  .mini-popover,
  .mini-popover-card,
  .mc-issue-overlay,
  .mc-issue-overlay-panel,
  .protip-popup-overlay,
  .protip-popup,
  .for-you-card-meta,
  .for-you-popover-card,
  .mc-filters-panel,
  .page-magnifier,
  #site-footer {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .card,
  .random-card-day-btn,
  .mini-popover-card,
  .mc-issue-overlay-panel,
  .for-you-popover-card,
  .modal,
  .flyout,
  .protip-popup,
  .mc-filters-panel {
    box-shadow: none !important;
  }

  .card,
  .mini-row,
  .for-you-card,
  .comic-cuts-row,
  .random-card-day-btn {
    transition: none !important;
  }

  html::before {
    transform: none !important;
  }
}

/* === SOURCE: 055-ccc-mobile-ultrafast-css.css === */
/* MOBILE ULTRAFAST PATCH: mobile-only extra paint/layout reductions.
   Desktop/tablet fine-pointer styling remains unchanged. */
@media (max-width: 820px), (hover: none) and (pointer: coarse) {
  html::before {
    background:
      radial-gradient(900px 620px at 10% -8%, #250f5a 0%, transparent 52%),
      #000000 !important;
  }

  *, *::before, *::after {
    scroll-behavior: auto !important;
  }

  .card,
  .mini-row,
  .mini-issue-header,
  .for-you-card,
  .comic-cuts-row,
  .random-card-day-btn,
  .altthumb,
  .altthumb img,
  .gallery-open-btn,
  .mobile-1cc-gallery-toggle,
  .mc-gallery-card,
  .mc-gallery-slide,
  .mc-progress-track,
  .progress-bar,
  .progress {
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
  }

  .topbar,
  .searchwrap,
  .card,
  .ac,
  .flyout-overlay,
  .flyout,
  .modal-overlay,
  .modal,
  .mini-popover,
  .mini-popover-card,
  .mc-issue-overlay,
  .mc-issue-overlay-panel,
  .protip-popup-overlay,
  .protip-popup,
  .for-you-card-meta,
  .for-you-popover-card,
  .mc-filters-panel,
  .page-magnifier,
  .mobile-1cc-gallery-toggle,
  .altthumbs-wrap,
  .more {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    filter: none !important;
  }

  .card,
  .random-card-day-btn,
  .mini-popover-card,
  .mc-issue-overlay-panel,
  .for-you-popover-card,
  .modal,
  .flyout,
  .protip-popup,
  .mc-filters-panel,
  .altthumbs-wrap,
  .more {
    box-shadow: none !important;
  }

  .mini-results:not(.ccc-mobile-paginated-mini-results) .mini-row,
  .mini-results:not(.ccc-mobile-paginated-mini-results) .mini-issue-header,
  .for-you-card,
  .comic-cuts-row {
    content-visibility: auto;
    contain-intrinsic-size: 120px 160px;
  }

  .more,
  .altthumbs-wrap {
    overscroll-behavior: contain;
  }
}

/* === SOURCE: 056-mobile-altthumb-selection-flash-fix.css === */
@media (max-width: 780px), (hover: none) and (pointer: coarse) {
  .altthumbs-wrap,
  .altthumbs,
  .altthumb,
  .altthumb img,
  .alt-owner-scroll-viewport,
  .mobile-1cc-gallery-grid {
    transition: none !important;
    animation: none !important;
  }

  .altthumb,
  .altthumb:hover,
  .altthumb:active,
  .altthumb:focus,
  .altthumb:focus-visible {
    background: transparent !important;
    outline: none !important;
    box-shadow: none !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  .altthumb img {
    opacity: 1 !important;
    transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    will-change: auto !important;
  }

  body.ccc-mobile-thumb-selecting .altthumb,
  body.ccc-mobile-thumb-selecting .altthumb img {
    transition: none !important;
    animation: none !important;
  }
}


@media (max-width: 780px), (hover: none) and (pointer: coarse) {
  .card.ccc-mobile-full-detail-card .imagepage .ccc-main-image-thumbnail-loading{
    position:absolute;
    inset:0;
    z-index:8;
    display:grid;
    place-items:center;
    pointer-events:none;
    background:rgba(8,9,12,.18);
  }

  .card.ccc-mobile-full-detail-card .imagepage .ccc-main-image-thumbnail-loading[hidden]{
    display:none !important;
  }

  .card.ccc-mobile-full-detail-card .ccc-main-image-thumbnail-loading .material-symbols-outlined{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:46px;
    height:46px;
    border:1px solid rgba(255,255,255,.24);
    border-radius:999px;
    background:rgba(10,11,14,.72);
    color:#fff;
    font-size:28px;
    line-height:1;
    box-shadow:0 8px 24px rgba(0,0,0,.28);
    animation:ccc-main-image-thumbnail-spin .8s linear infinite;
  }
}

@keyframes ccc-main-image-thumbnail-spin{
  to{ transform:rotate(360deg); }
}

@media (prefers-reduced-motion: reduce){
  .ccc-main-image-thumbnail-loading .material-symbols-outlined{
    animation:none !important;
  }
}

/* === SOURCE: 057-ccc-mobile-image-speed-flash-fix-css.css === */
@media (max-width: 820px), (hover: none) and (pointer: coarse) {
  .card .thumb img,
  .imagepage img,
  .altthumb img,
  .mini-row img,
  .mini-tile-img,
  .random-card-day-media img,
  .for-you-card img {
    opacity: 1 !important;
    visibility: visible !important;
    transition: none !important;
    animation: none !important;
    filter: none !important;
    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
  }

  .card .thumb,
  .imagepage,
  .altthumb,
  .mini-row,
  .random-card-day-media,
  .for-you-card {
    background-color: rgba(255,255,255,.035) !important;
    transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }

  .card .thumb img,
  .imagepage img {
    min-height: 180px;
    background-color: rgba(255,255,255,.035) !important;
  }

  .altthumb img {
    background-color: rgba(255,255,255,.045) !important;
    contain: paint;
  }

  body.ccc-mobile-image-selecting .card .thumb img,
  body.ccc-mobile-image-selecting .altthumb img,
  .ccc-mobile-img-stable {
    opacity: 1 !important;
    visibility: visible !important;
    transition: none !important;
    animation: none !important;
  }

  /* The active thumbnail window is visible UI, so don't let older lazy/content
     policies make its images disappear and repaint as a group. */
  .altthumbs-wrap,
  .altthumbs-wrap * {
    content-visibility: visible !important;
  }
}

/* === SOURCE: 058-ccc-browse-list-mini-popover-like-my-collection.css === */
/* Mobile-only: make Browse List comic-book tile popovers use the same dark,
   solid-feeling overlay treatment as My Collection issue tiles. This targets
   the mini "View" overlay that appears after Browse List -> Set -> Comic Books. */
@media (max-width: 780px), (hover: none) and (pointer: coarse) {
  #result .mini-results .mini-row .mini-popover,
  body.browse-list-open #result .mini-results .mini-row .mini-popover {
    background: rgba(10, 10, 12, 0.68) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  #result .mini-results .mini-row .mini-popover.open,
  body.browse-list-open #result .mini-results .mini-row .mini-popover.open {
    display: flex !important;
  }

  #result .mini-results .mini-row .mini-popover-card,
  body.browse-list-open #result .mini-results .mini-row .mini-popover-card {
    background: rgba(0, 0, 0, 0.52) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  #result .mini-results .mini-row .mini-popover-cardnum,
  #result .mini-results .mini-row .mini-popover-serial,
  body.browse-list-open #result .mini-results .mini-row .mini-popover-cardnum,
  body.browse-list-open #result .mini-results .mini-row .mini-popover-serial {
    text-shadow: 0 2px 10px rgba(0,0,0,.75), 0 1px 2px rgba(0,0,0,.85) !important;
  }

  #result .mini-results .mini-row .mini-popover-divider,
  body.browse-list-open #result .mini-results .mini-row .mini-popover-divider {
    background: rgba(255, 255, 255, 0.24) !important;
  }

  #result .mini-results .mini-row .mini-popover-view,
  body.browse-list-open #result .mini-results .mini-row .mini-popover-view {
    background: rgba(255, 255, 255, 0.10) !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    color: rgba(255, 255, 255, 0.96) !important;
    box-shadow: none !important;
  }

  #result .mini-results .mini-row .mini-popover-hunt,
  body.browse-list-open #result .mini-results .mini-row .mini-popover-hunt {
    color: rgba(255,255,255,0.96) !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.75) !important;
  }
}

/* === SOURCE: 059-mc-compact-collector-header-v4.css === */
/* Compact collector header refresh: progress first, status stack left, awards right, issue stat below. */
.mc-profile-card[data-expanded="true"] .mc-profile-expand{
  gap:8px !important;
}
.mc-profile-expand{
  padding-top:8px !important;
}
.mc-profile-detail-grid{
  grid-template-columns:minmax(168px, 218px) minmax(0, 1fr) !important;
  gap:8px !important;
  align-items:start !important;
}
.mc-progress-row{
  margin-top:4px !important;
}
.mc-status-pills{
  gap:6px !important;
  padding:8px !important;
  align-content:start !important;
}
.mc-status-pill{
  min-height:38px !important;
  padding:8px 10px !important;
  gap:8px !important;
  align-items:center !important;
  white-space:nowrap !important;
}
.mc-status-num{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:32px !important;
  padding-right:8px !important;
  font-size:14px !important;
  line-height:1 !important;
}
.mc-status-label{
  display:inline !important;
  font-size:10.5px !important;
  line-height:1 !important;
  white-space:nowrap !important;
}
.mc-profile-awards{
  min-height:auto !important;
  gap:7px !important;
  padding:8px !important;
}
.mc-profile-awards-title{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  font-size:9.5px !important;
  line-height:1 !important;
}
.mc-profile-awards-title::after{
  display:none !important;
  content:'' !important;
}
.mc-profile-awards-list{
  display:grid !important;
  grid-template-columns:repeat(auto-fit, minmax(148px, 1fr)) !important;
  gap:6px !important;
  width:100% !important;
}
.mc-profile-award{
  width:100% !important;
  min-height:38px !important;
  padding:8px 9px !important;
  gap:7px !important;
  font-size:10.5px !important;
}
.mc-profile-award-no{
  min-width:35px !important;
  min-height:22px !important;
  padding:4px 7px !important;
  font-size:10.5px !important;
}
.mc-profile-award-label{
  gap:6px !important;
}
.mc-profile-award .material-symbols-outlined{
  font-size:18px !important;
}
.mc-most-collected-grid--compact{
  grid-template-columns:1fr !important;
  gap:0 !important;
}
.mc-most-collected-card--compact{
  display:grid !important;
  grid-template-columns:auto minmax(0, 1fr) auto !important;
  align-items:center !important;
  gap:10px !important;
  padding:8px 10px !important;
}
.mc-most-collected-card--compact b{
  white-space:nowrap !important;
  font-size:9.5px !important;
}
.mc-most-collected-card--compact span{
  font-size:12.5px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.mc-most-collected-card--compact small{
  white-space:nowrap !important;
  font-size:10.5px !important;
}
@media (max-width:620px){
  .mc-profile-detail-grid{
    grid-template-columns:1fr !important;
  }
  .mc-most-collected-card--compact{
    grid-template-columns:1fr !important;
    gap:4px !important;
  }
  .mc-most-collected-card--compact span,
  .mc-most-collected-card--compact small{
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
  }
}

/* === SOURCE: 060-mc-header-status-inline-v6.css === */
/* V6: status counts are subtle text above progress; filter buttons no longer force-open the header. */
.mc-profile-card[data-expanded="true"] .mc-profile-expand{
  gap:6px !important;
}
.mc-status-summary.mc-status-summary--inline{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-wrap:wrap !important;
  gap:6px 12px !important;
  padding:0 1px 2px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.mc-status-summary--inline .mc-status-summary-title{
  display:none !important;
}
.mc-status-summary--inline .mc-status-summary-row{
  min-height:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  display:inline-flex !important;
  align-items:baseline !important;
  justify-content:flex-start !important;
  gap:4px !important;
  color:rgba(255,255,255,.70) !important;
  line-height:1.1 !important;
  white-space:nowrap !important;
}
.mc-status-summary--inline .mc-status-summary-row strong{
  flex:0 0 auto !important;
  font-size:11px !important;
  font-weight:900 !important;
  color:rgba(255,255,255,.88) !important;
  line-height:1 !important;
  font-variant-numeric:tabular-nums !important;
}
.mc-status-summary--inline .mc-status-summary-row span{
  flex:0 0 auto !important;
  min-width:0 !important;
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
  text-align:left !important;
  font-size:9px !important;
  font-weight:850 !important;
  letter-spacing:.055em !important;
  line-height:1 !important;
  text-transform:uppercase !important;
  color:rgba(255,255,255,.55) !important;
}
.mc-profile-detail-grid--awards-only{
  grid-template-columns:1fr !important;
  gap:0 !important;
}
.mc-profile-detail-grid--awards-only .mc-profile-awards{
  min-width:0 !important;
}
.mc-progress-row{
  margin-top:2px !important;
}
@media (max-width:520px){
  .mc-status-summary.mc-status-summary--inline{
    gap:5px 8px !important;
  }
  .mc-status-summary--inline .mc-status-summary-row strong{
    font-size:10px !important;
  }
  .mc-status-summary--inline .mc-status-summary-row span{
    font-size:8px !important;
    letter-spacing:.035em !important;
  }
  .mc-profile-awards-list{
    grid-template-columns:1fr !important;
  }
  .mc-profile-award,
  .mc-profile-award-label,
  .mc-profile-award-label span:last-child{
    min-width:0 !important;
    max-width:100% !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
  }
}

/* === SOURCE: 061-mc-header-status-awards-v7.css === */
/* V7: center header status counts; collector awards are icon + text only. */
.mc-status-summary.mc-status-summary--inline{
  justify-content:center !important;
  text-align:center !important;
}
.mc-status-summary--inline .mc-status-summary-row{
  justify-content:center !important;
}
.mc-profile-award-no{
  display:none !important;
}
.mc-profile-award{
  gap:8px !important;
}
.mc-profile-award-label{
  width:100% !important;
  justify-content:flex-start !important;
}
.mc-profile-awards-list{
  min-width:0 !important;
}
@media (max-width:520px){
  .mc-status-summary.mc-status-summary--inline{
    justify-content:center !important;
    text-align:center !important;
  }
  .mc-status-summary--inline .mc-status-summary-row{
    justify-content:center !important;
  }
  .mc-profile-award-label{
    justify-content:flex-start !important;
  }
}

/* === SOURCE: 062-mc-header-divider-cleanup-v8.css === */
/* V8: subtle dividers only, compact unboxed awards/stat areas. */
.mc-status-summary.mc-status-summary--inline{
  position:relative !important;
  padding:8px 0 8px !important;
  margin:0 !important;
}
.mc-status-summary.mc-status-summary--inline::before,
.mc-status-summary.mc-status-summary--inline::after{
  content:'' !important;
  display:block !important;
  flex-basis:100% !important;
  width:100% !important;
  height:1px !important;
  background:rgba(255,255,255,.14) !important;
  box-shadow:0 1px 0 rgba(0,0,0,.18) !important;
}
.mc-status-summary.mc-status-summary--inline::before{
  margin:0 0 6px !important;
}
.mc-status-summary.mc-status-summary--inline::after{
  margin:6px 0 0 !important;
}
.mc-progress-row{
  margin-top:3px !important;
}
.mc-profile-awards{
  padding:8px 0 0 !important;
  border:0 !important;
  border-top:1px solid rgba(255,255,255,.14) !important;
  background:transparent !important;
  box-shadow:none !important;
}
.mc-profile-awards-title{
  padding:0 !important;
}
.mc-profile-award{
  min-height:0 !important;
  padding:5px 0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.mc-profile-awards-list{
  gap:8px 14px !important;
}
.mc-most-collected-grid--compact{
  padding-top:8px !important;
  border-top:1px solid rgba(255,255,255,.14) !important;
}
.mc-most-collected-card,
.mc-most-collected-card--compact{
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
@media (max-width:520px){
  .mc-status-summary.mc-status-summary--inline{
    padding:7px 0 7px !important;
  }
  .mc-profile-awards-list{
    gap:5px !important;
  }
  .mc-profile-award{
    width:100% !important;
  }
}

/* === SOURCE: 063-mc-header-frame-divider-cleanup-v9.css === */
/* V9: remove the inner trading-card frame and shorten all separator lines. */
.mc-profile-card::before{
  display:none !important;
  content:none !important;
  border:0 !important;
}

/* Keep the status counts as plain centered text, not a boxed area. */
.mc-status-summary.mc-status-summary--inline{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:7px 0 !important;
  gap:5px !important;
}
.mc-status-summary--inline .mc-status-summary-row{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:2px 7px !important;
  min-height:0 !important;
}
.mc-status-summary.mc-status-summary--inline::before,
.mc-status-summary.mc-status-summary--inline::after{
  flex:0 0 auto !important;
  width:min(260px, 58%) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  background:rgba(255,255,255,.15) !important;
  box-shadow:none !important;
}
.mc-status-summary.mc-status-summary--inline::before{
  margin-top:0 !important;
  margin-bottom:6px !important;
}
.mc-status-summary.mc-status-summary--inline::after{
  margin-top:6px !important;
  margin-bottom:0 !important;
}

/* Replace full-width section borders with shorter centered dividers. */
.mc-profile-awards,
.mc-most-collected-grid--compact{
  position:relative !important;
  border-top:0 !important;
}
.mc-profile-awards::before,
.mc-most-collected-grid--compact::before{
  content:'' !important;
  display:block !important;
  width:min(260px, 58%) !important;
  height:1px !important;
  margin:0 auto 8px !important;
  background:rgba(255,255,255,.15) !important;
}
.mc-profile-awards{
  padding-top:0 !important;
}
.mc-most-collected-grid--compact{
  padding-top:0 !important;
}

@media (max-width:520px){
  .mc-status-summary.mc-status-summary--inline::before,
  .mc-status-summary.mc-status-summary--inline::after,
  .mc-profile-awards::before,
  .mc-most-collected-grid--compact::before{
    width:min(190px, 64%) !important;
  }
}

/* === SOURCE: 064-mc-header-award-color-boxes-v10.css === */
/* V10: restore the colored individual Collector Award boxes while keeping the parent section unboxed. */
.mc-profile-awards{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.mc-profile-awards-list{
  gap:7px 9px !important;
}
.mc-profile-award{
  width:auto !important;
  min-height:34px !important;
  padding:7px 10px !important;
  border:1px solid rgba(255,255,255,.16) !important;
  background:rgba(255,255,255,.052) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.025) !important;
}
.mc-profile-award.issue-specialist{
  border-color:rgba(255,214,0,.42) !important;
  background:linear-gradient(90deg, rgba(255,214,0,.17), rgba(255,255,255,.045)) !important;
}
.mc-profile-award.centurion{
  border-color:rgba(154,139,255,.56) !important;
  background:linear-gradient(90deg, rgba(154,139,255,.23), rgba(255,255,255,.045)) !important;
}
.mc-profile-award.key-issue{
  border-color:rgba(118,220,255,.52) !important;
  background:linear-gradient(90deg, rgba(118,220,255,.18), rgba(255,255,255,.045)) !important;
}
.mc-profile-award.issue-specialist .material-symbols-outlined{ color:#ffe89a !important; }
.mc-profile-award.centurion .material-symbols-outlined{ color:#cfc5ff !important; }
.mc-profile-award.key-issue .material-symbols-outlined{ color:#b8f1ff !important; }
@media (max-width:520px){
  .mc-profile-awards-list{
    grid-template-columns:1fr !important;
    gap:6px !important;
  }
  .mc-profile-award{
    width:100% !important;
    padding:7px 9px !important;
  }
}

/* === SOURCE: 065-mc-owner-progress-divider-cleanup-v14.css === */
/* V14: when viewing another collector, the private progress bar is hidden, so also hide the divider that belonged above it. */
.mc-profile-card--no-progress .mc-status-summary.mc-status-summary--inline{
  padding-bottom:3px !important;
}
.mc-profile-card--no-progress .mc-status-summary.mc-status-summary--inline::after{
  display:none !important;
  content:none !important;
}
.mc-profile-card--no-progress .mc-profile-awards::before{
  margin-top:4px !important;
}

/* === SOURCE: 066-mc-collector-header-order-v15.css === */
/* V15: collector header order: awards first, status with vertical dividers, shorter private progress, most-collected last. */
.mc-profile-expand{
  gap: 8px !important;
}
.mc-profile-detail-grid.mc-profile-detail-grid--awards-only{
  display: block !important;
  grid-template-columns: 1fr !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.mc-profile-awards{
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  min-height: 0 !important;
}
.mc-profile-awards-title{
  display: none !important;
}
.mc-profile-awards-list{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  width: 100% !important;
}
.mc-profile-award{
  width: auto !important;
  min-width: 0 !important;
  min-height: 30px !important;
  padding: 6px 9px !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  line-height: 1 !important;
}
.mc-profile-award-label{
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  white-space: nowrap !important;
}
.mc-profile-award .material-symbols-outlined{
  font-size: 16px !important;
}
.mc-status-summary.mc-status-summary--inline{
  width: 100% !important;
  max-width: 620px !important;
  margin: 2px auto 0 !important;
  padding: 9px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(255,255,255,.14) !important;
  background: transparent !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0 !important;
  text-align: center !important;
}
.mc-status-summary.mc-status-summary--inline::before,
.mc-status-summary.mc-status-summary--inline::after{
  display: none !important;
  content: none !important;
}
.mc-status-summary--inline .mc-status-summary-row{
  display: inline-flex !important;
  align-items: baseline !important;
  justify-content: center !important;
  gap: 4px !important;
  min-height: 0 !important;
  padding: 0 10px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(255,255,255,.74) !important;
  width: auto !important;
  flex: 0 0 auto !important;
}
.mc-status-summary--inline .mc-status-summary-row + .mc-status-summary-row{
  border-left: 1px solid rgba(255,255,255,.18) !important;
}
.mc-status-summary--inline .mc-status-summary-row strong{
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  color: rgba(255,255,255,.86) !important;
}
.mc-status-summary--inline .mc-status-summary-row span{
  flex: 0 0 auto !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  letter-spacing: .065em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  text-align: left !important;
  color: rgba(255,255,255,.58) !important;
}
.mc-profile-expand > .mc-progress-btn{
  width: min(76%, 540px) !important;
  margin: 6px auto 0 !important;
  display: block !important;
}
.mc-profile-card[data-expanded="false"] .mc-profile-expand > .mc-progress-btn,
.mc-profile-card[data-expanded="false"] .mc-profile-expand > .mc-progress-btn .mc-progress-row{
  display: none !important;
}
.mc-profile-expand > .mc-progress-btn .mc-progress-row{
  margin-top: 0 !important;
}
.mc-profile-card--no-progress .mc-profile-expand > .mc-progress-btn{
  display: none !important;
}
.mc-most-collected-grid--compact{
  width: 100% !important;
  max-width: 620px !important;
  margin: 2px auto 0 !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(255,255,255,.14) !important;
}
.mc-most-collected-card--compact{
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
@media (max-width: 620px){
  .mc-profile-awards-list{
    gap: 5px !important;
  }
  .mc-profile-award{
    max-width: 100% !important;
    white-space: normal !important;
  }
  .mc-profile-award-label{
    white-space: normal !important;
  }
  .mc-status-summary.mc-status-summary--inline{
    max-width: 100% !important;
    overflow-x: auto !important;
    justify-content: center !important;
    padding-top: 8px !important;
  }
  .mc-status-summary--inline .mc-status-summary-row{
    padding: 0 7px !important;
  }
  .mc-status-summary--inline .mc-status-summary-row strong{
    font-size: 10px !important;
  }
  .mc-status-summary--inline .mc-status-summary-row span{
    font-size: 8px !important;
    letter-spacing: .045em !important;
  }
  .mc-profile-expand > .mc-progress-btn{
    width: min(88%, 420px) !important;
  }
}

/* === SOURCE: 067-mc-awards-next-to-cuts-v20.css === */
/* V20: award icons live beside the total Comic Cuts count instead of taking their own expanded row. */
.mc-cuts-pill{
  align-items:center !important;
  gap:6px !important;
  max-width:100% !important;
}
.mc-cuts-award-icons{
  display:inline-flex !important;
  align-items:center !important;
  gap:4px !important;
  margin-left:4px !important;
  padding-left:8px !important;
  border-left:1px solid rgba(255,255,255,.18) !important;
  white-space:nowrap !important;
}
.mc-cuts-award-icon{
  width:22px !important;
  height:22px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.16) !important;
  background:rgba(255,255,255,.06) !important;
  box-shadow:0 6px 14px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.035) !important;
}
.mc-cuts-award-icon .material-symbols-outlined{
  font-size:15px !important;
  line-height:1 !important;
  font-variation-settings:'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24 !important;
}
.mc-cuts-award-icon.issue-specialist{
  border-color:rgba(255,214,0,.42) !important;
  background:rgba(255,214,0,.14) !important;
}
.mc-cuts-award-icon.issue-specialist .material-symbols-outlined{ color:#ffe89a !important; }
.mc-cuts-award-icon.centurion{
  border-color:rgba(154,139,255,.55) !important;
  background:rgba(154,139,255,.18) !important;
}
.mc-cuts-award-icon.centurion .material-symbols-outlined{ color:#cfc5ff !important; }
.mc-cuts-award-icon.key-issue{
  border-color:rgba(118,220,255,.50) !important;
  background:rgba(118,220,255,.14) !important;
}
.mc-cuts-award-icon.key-issue .material-symbols-outlined{ color:#b8f1ff !important; }
.mc-profile-detail-grid.mc-profile-detail-grid--awards-only{
  display:none !important;
}
@media (max-width:520px){
  .mc-profile-row{
    gap:8px !important;
  }
  .mc-cuts-pill{
    padding:7px 8px !important;
    gap:5px !important;
  }
  .mc-cuts-pill .num{
    font-size:16px !important;
  }
  .mc-cuts-pill .lbl{
    font-size:10px !important;
  }
  .mc-cuts-award-icons{
    gap:3px !important;
    margin-left:2px !important;
    padding-left:6px !important;
  }
  .mc-cuts-award-icon{
    width:20px !important;
    height:20px !important;
  }
  .mc-cuts-award-icon .material-symbols-outlined{
    font-size:14px !important;
  }
}
@media (max-width:370px){
  .mc-cuts-pill .lbl{
    display:none !important;
  }
}

/* === SOURCE: 068-mc-cuts-award-icons-mobile-fit-v21.css === */
/* V21: keep the Comic Cuts count + award icons from pushing off-screen on mobile. */
.mc-profile-row{
  min-width:0 !important;
}
.mc-profile-left{
  flex:1 1 auto !important;
  min-width:0 !important;
}
.mc-cuts-pill{
  flex:0 1 auto !important;
  min-width:0 !important;
  max-width:min(58%, 245px) !important;
  overflow:hidden !important;
}
.mc-cuts-pill .num,
.mc-cuts-pill .lbl,
.mc-cuts-award-icons{
  flex:0 0 auto !important;
  min-width:0 !important;
}
@media (max-width:620px){
  .mc-profile-row{
    gap:7px !important;
  }
  .mc-profile-left{
    max-width:calc(100% - 118px) !important;
  }
  .mc-cuts-pill{
    max-width:52% !important;
    padding:6px 7px !important;
    gap:4px !important;
    justify-content:flex-end !important;
  }
  .mc-cuts-pill .num{
    font-size:15px !important;
    max-width:54px !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }
  .mc-cuts-pill .lbl{
    font-size:9px !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }
  .mc-cuts-award-icons{
    gap:2px !important;
    margin-left:2px !important;
    padding-left:5px !important;
  }
  .mc-cuts-award-icon{
    width:18px !important;
    height:18px !important;
  }
  .mc-cuts-award-icon .material-symbols-outlined{
    font-size:13px !important;
  }
}
@media (max-width:430px){
  .mc-profile-left{
    max-width:calc(100% - 96px) !important;
  }
  .mc-cuts-pill{
    max-width:46% !important;
  }
  .mc-cuts-pill .lbl{
    display:none !important;
  }
  .mc-cuts-pill .num{
    max-width:48px !important;
  }
  .mc-cuts-award-icons{
    border-left:1px solid rgba(255,255,255,.16) !important;
    padding-left:4px !important;
    margin-left:1px !important;
  }
}
@media (max-width:360px){
  .mc-cuts-pill{
    max-width:44% !important;
    padding:5px 6px !important;
  }
  .mc-cuts-pill .num{
    font-size:14px !important;
    max-width:42px !important;
  }
  .mc-cuts-award-icon{
    width:17px !important;
    height:17px !important;
  }
  .mc-cuts-award-icon .material-symbols-outlined{
    font-size:12px !important;
  }
}

/* === SOURCE: 069-mc-profile-header-no-grid-v22.css === */
/* V22: remove the graph/grid texture from the collector header background. */
.mc-profile-card::after{
  display:none !important;
  content:none !important;
  background:none !important;
  opacity:0 !important;
}

/* === SOURCE: 070-mc-header-visual-stats-v23.css === */
/* V24: visual highlights as one list; Grail Cut hides dollar amount. */
.mc-header-visual-stats{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  align-items:stretch !important;
}
.mc-header-visual-stat{
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:46px minmax(0, 1fr) !important;
  align-items:center !important;
  gap:9px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.mc-header-visual-stat-media{
  width:46px !important;
  aspect-ratio:3 / 4 !important;
  display:grid !important;
  place-items:center !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.14) !important;
  background:rgba(255,255,255,.04) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.18) !important;
}
.mc-header-visual-stat-media img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}
.mc-header-visual-stat-media .material-symbols-outlined{
  font-size:20px !important;
  color:rgba(255,255,255,.58) !important;
}
.mc-header-visual-stat-copy{
  min-width:0 !important;
  display:grid !important;
  gap:3px !important;
  align-content:center !important;
}
.mc-header-visual-stat-copy b{
  font-size:9.5px !important;
  font-weight:900 !important;
  line-height:1 !important;
  letter-spacing:.075em !important;
  text-transform:uppercase !important;
  color:rgba(255,255,255,.58) !important;
  white-space:nowrap !important;
}
.mc-header-visual-stat-copy span{
  min-width:0 !important;
  font-size:12.5px !important;
  font-weight:850 !important;
  line-height:1.15 !important;
  color:rgba(255,255,255,.92) !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.mc-header-visual-stat-copy small{
  min-width:0 !important;
  font-size:10px !important;
  font-weight:750 !important;
  line-height:1.15 !important;
  color:rgba(255,255,255,.54) !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
@media (max-width:620px){
  .mc-header-visual-stats{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
  .mc-header-visual-stat{
    grid-template-columns:42px minmax(0, 1fr) !important;
    gap:8px !important;
  }
  .mc-header-visual-stat-media{
    width:42px !important;
  }
  .mc-header-visual-stat-copy span{
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
  }
}

/* === SOURCE: 071-mobile-solid-topbar-patch.css === */
/* Mobile-only solid top bar. Desktop keeps the original glass top bar. */
@media (max-width: 780px){
  .topbar{
    background: #101114 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: 0 4px 16px rgba(0,0,0,.45) !important;
  }
}

/* === SOURCE: 072-ccc-set-overview-box-styles.css === */
/* ===== Set overview box above Comic Books / Checklist buttons ===== */
.ccc-set-overview-wrap{
  width:100%;
  display:flex;
  justify-content:center;
  margin:6px 0 10px;
}
.ccc-set-overview-card{
  width:min(520px, 100%);
}
.ccc-set-overview-card .mc-profile-sub{
  white-space:normal;
  overflow-wrap:anywhere;
}
.ccc-set-overview-card[data-expanded="true"] .ccc-set-overview-expand{
  display:grid;
  gap:10px;
  max-height:260px;
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.ccc-set-overview-expand{
  display:none;
  width:100%;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.12);
  font-size:13px;
  line-height:1.35;
}
.ccc-set-overview-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:8px;
}
.ccc-set-overview-stat{
  min-width:0;
  display:grid;
  gap:4px;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.14);
}
.ccc-set-overview-stat label{
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ccc-set-overview-stat strong{
  color:var(--text);
  font-size:15px;
  line-height:1.2;
  overflow-wrap:anywhere;
}
.ccc-set-overview-section{
  display:grid;
  gap:7px;
  padding:10px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.025);
}
.ccc-set-overview-section-title{
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ccc-set-overview-pillrow{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.ccc-set-overview-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  max-width:100%;
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(0,0,0,.18);
  color:rgba(255,255,255,.86);
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  line-height:1.15;
  text-transform:uppercase;
  overflow-wrap:anywhere;
}
.ccc-set-overview-pill--button{
  appearance:none;
  -webkit-appearance:none;
  font:inherit;
  cursor:pointer;
  text-align:center;
}
.ccc-set-overview-pill--button:hover,
.ccc-set-overview-pill--button:focus-visible{
  border-color:rgba(255,255,255,.45);
  background:rgba(255,255,255,.08);
  color:#fff;
  outline:none;
}
.ccc-set-overview-pill--button:active{
  transform:translateY(1px);
}
.mini-subset-header.ccc-subset-scroll-highlight{
  border-bottom-color:#ffffff !important;
}
.ccc-set-overview-note{
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}
@media (max-width:620px){
  .ccc-set-overview-grid{ grid-template-columns:1fr; }
  .ccc-set-overview-card[data-expanded="true"] .ccc-set-overview-expand{ max-height:240px; }
}

/* === SOURCE: 073-ccc-set-overview-collapse-hard-fix.css === */
/* Hard fix: set overview must start collapsed and stay collapsed when switching views. */
.ccc-set-overview-card[data-expanded="false"] .ccc-set-overview-expand,
.ccc-set-overview-card[aria-expanded="false"] .ccc-set-overview-expand{
  display:none !important;
  max-height:0 !important;
  overflow:hidden !important;
  padding-top:0 !important;
  border-top:0 !important;
}
.ccc-set-overview-card[data-expanded="true"] .ccc-set-overview-expand,
.ccc-set-overview-card[aria-expanded="true"] .ccc-set-overview-expand{
  display:grid !important;
  gap:10px !important;
  max-height:260px !important;
  overflow:auto !important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding-top:8px !important;
  border-top:1px solid rgba(255,255,255,.12) !important;
}
@media (max-width:780px){
  .ccc-set-overview-card[data-expanded="true"] .ccc-set-overview-expand,
  .ccc-set-overview-card[aria-expanded="true"] .ccc-set-overview-expand{ max-height:240px !important; }
}

/* === SOURCE: 074-ccc-set-overview-vertical-scroll-fix.css === */
/* Set overview should only scroll vertically. It should not inherit mobile collection
   compositing transforms that can make the inside content drift/rotate while swiping. */
.ccc-set-overview-card{
  overflow:hidden !important;
  touch-action:manipulation !important;
}
.ccc-set-overview-card .ccc-set-overview-expand{
  width:100% !important;
  max-width:100% !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior-y:contain !important;
  overscroll-behavior-x:none !important;
  touch-action:pan-y !important;
  -webkit-overflow-scrolling:touch !important;
  transform:none !important;
  -webkit-transform:none !important;
  backface-visibility:visible !important;
  -webkit-backface-visibility:visible !important;
  will-change:auto !important;
}
.ccc-set-overview-card .ccc-set-overview-expand,
.ccc-set-overview-card .ccc-set-overview-expand *{
  min-width:0 !important;
  max-width:100% !important;
}
.ccc-set-overview-card .ccc-set-overview-grid,
.ccc-set-overview-card .ccc-set-overview-section,
.ccc-set-overview-card .ccc-set-overview-pillrow{
  overflow-x:hidden !important;
}
.ccc-set-overview-card .ccc-set-overview-pillrow{
  align-items:flex-start;
}
.ccc-set-overview-card .ccc-set-overview-pill{
  white-space:normal !important;
  text-align:center;
}
@media (max-width:780px){
  .ccc-set-overview-wrap,
  .ccc-set-overview-card,
  .ccc-set-overview-card .mc-profile-row,
  .ccc-set-overview-card .mc-profile-left,
  .ccc-set-overview-card .ccc-set-overview-expand{
    transform:none !important;
    -webkit-transform:none !important;
    backface-visibility:visible !important;
    -webkit-backface-visibility:visible !important;
    will-change:auto !important;
    contain:none !important;
  }
}

/* === SOURCE: 075-ccc-set-overview-no-inner-scroll-v7.css === */
/* v7: Subset names and owners are no longer scrollable windows.
   The expanded set overview lays content out naturally, with compact "+ more" pills
   that reveal extra names inline instead of creating nested scroll areas. */
.ccc-set-overview-card[data-expanded="true"] .ccc-set-overview-expand,
.ccc-set-overview-card[aria-expanded="true"] .ccc-set-overview-expand{
  max-height:none !important;
  overflow:visible !important;
  overflow-x:visible !important;
  overflow-y:visible !important;
  touch-action:auto !important;
}
.ccc-set-overview-section{
  overflow:visible !important;
}
.ccc-set-overview-pillrow{
  overflow:visible !important;
  max-height:none !important;
}
.ccc-set-overview-pill.is-hidden{
  display:none !important;
}
.ccc-set-overview-pillrow.is-showing-all .ccc-set-overview-pill.is-hidden{
  display:inline-flex !important;
}
.ccc-set-overview-more{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:5px 8px;
  border:1px solid rgba(154,139,255,.38);
  background:rgba(154,139,255,.12);
  color:#e7e2ff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  line-height:1.15;
  text-transform:uppercase;
  cursor:pointer;
}
.ccc-set-overview-more:hover,
.ccc-set-overview-more:focus-visible{
  border-color:rgba(154,139,255,.70);
  background:rgba(154,139,255,.20);
  color:#fff;
  outline:none;
}
@media (max-width:780px){
  .ccc-set-overview-card[data-expanded="true"] .ccc-set-overview-expand,
  .ccc-set-overview-card[aria-expanded="true"] .ccc-set-overview-expand{
    max-height:none !important;
  }
}

/* === SOURCE: 076-ccc-set-overview-responsive-tight-v8.css === */
/* v8: keep Subsets + Total Cards together on mobile and make those stats compact on desktop. */
.ccc-set-overview-grid{
  grid-template-columns:minmax(72px,.68fr) minmax(78px,.72fr) minmax(0,1.6fr) !important;
  align-items:stretch;
}
.ccc-set-overview-stat{
  padding:7px 8px !important;
  gap:2px !important;
}
.ccc-set-overview-stat label{
  font-size:9px !important;
  letter-spacing:.06em !important;
  white-space:nowrap;
}
.ccc-set-overview-stat strong{
  font-size:13px !important;
  line-height:1.12 !important;
}
.ccc-set-overview-stat:nth-child(3) strong{
  font-size:12px !important;
}
.ccc-set-overview-card .mc-profile-row{
  min-width:0;
  gap:10px;
}
.ccc-set-overview-card .mc-profile-left{
  min-width:0;
}
.ccc-set-overview-card .mc-profile-name{
  overflow-wrap:anywhere;
  line-height:1.12;
}
.ccc-set-overview-card .mc-cuts-pill{
  flex:0 0 auto;
  min-width:58px;
}
@media (max-width:620px){
  .ccc-set-overview-grid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:6px !important;
  }
  .ccc-set-overview-stat:nth-child(1),
  .ccc-set-overview-stat:nth-child(2){
    grid-column:auto !important;
  }
  .ccc-set-overview-stat:nth-child(3){
    grid-column:1 / -1 !important;
  }
  .ccc-set-overview-stat{
    padding:6px 7px !important;
  }
  .ccc-set-overview-stat label{
    font-size:8px !important;
  }
  .ccc-set-overview-stat strong{
    font-size:12px !important;
  }
}

/* === SOURCE: 077-ccc-set-overview-owner-link-v8.css === */
.ccc-set-overview-owner-link{
  appearance:none;
  -webkit-appearance:none;
  font:inherit;
  cursor:pointer;
  text-align:center;
}
.ccc-set-overview-owner-link:hover,
.ccc-set-overview-owner-link:focus-visible{
  border-color:rgba(154,139,255,.58);
  background:rgba(154,139,255,.16);
  color:#fff;
  outline:none;
}
.ccc-set-overview-owner-link:active{ transform:translateY(1px); }

/* === SOURCE: 078-ccc-set-overview-subset-owner-scroll-v9.css === */
/* v9/v11 base: Subset Names and Owners use compact scrollable panels/slider.
   Pill labels now show the full value instead of shortening with ellipses. */
.ccc-set-overview-card[data-expanded="true"] .ccc-set-overview-expand,
.ccc-set-overview-card[aria-expanded="true"] .ccc-set-overview-expand{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:10px !important;
  max-height:300px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  touch-action:pan-y !important;
  padding-top:8px !important;
  border-top:1px solid rgba(255,255,255,.12) !important;
}
.ccc-set-overview-expand > .ccc-set-overview-grid,
.ccc-set-overview-expand > .ccc-set-overview-note{
  grid-column:1 / -1 !important;
}
.ccc-set-overview-section--subsets,
.ccc-set-overview-section--owners{
  min-width:0 !important;
  max-height:126px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain !important;
  -webkit-overflow-scrolling:touch !important;
  touch-action:pan-y !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pillrow,
.ccc-set-overview-section--owners .ccc-set-overview-pillrow{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  max-height:none !important;
  overflow:visible !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pill.is-hidden,
.ccc-set-overview-section--owners .ccc-set-overview-pill.is-hidden{
  display:inline-flex !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-more,
.ccc-set-overview-section--owners .ccc-set-overview-more{
  display:none !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pill,
.ccc-set-overview-section--owners .ccc-set-overview-pill{
  max-width:100% !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  overflow-wrap:anywhere !important;
}
.ccc-set-overview-section--subsets:only-of-type{
  grid-column:1 / -1 !important;
}
@media (max-width:620px){
  .ccc-set-overview-card[data-expanded="true"] .ccc-set-overview-expand,
  .ccc-set-overview-card[aria-expanded="true"] .ccc-set-overview-expand{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    max-height:285px !important;
  }
  .ccc-set-overview-section--subsets,
  .ccc-set-overview-section--owners{
    max-height:118px !important;
    padding:8px !important;
  }
  .ccc-set-overview-section-title{
    font-size:9px !important;
  }
  .ccc-set-overview-pill{
    font-size:9px !important;
    padding:4px 6px !important;
  }
}

/* === SOURCE: 079-ccc-set-overview-subset-owner-slider-v11.css === */
/* v11: Subset Names and Owners are swipeable slides instead of side-by-side boxes. */
.ccc-set-overview-card[data-expanded="true"] .ccc-set-overview-expand,
.ccc-set-overview-card[aria-expanded="true"] .ccc-set-overview-expand{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  max-height:310px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  touch-action:pan-y !important;
}
.ccc-set-overview-slider{
  grid-column:1 / -1 !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow:hidden !important;
  display:grid !important;
  gap:7px !important;
}
.ccc-set-overview-slider-track{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  display:flex !important;
  gap:0 !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  scroll-snap-type:x mandatory !important;
  scroll-behavior:smooth !important;
  -webkit-overflow-scrolling:touch !important;
  overscroll-behavior-x:contain !important;
  overscroll-behavior-y:auto !important;
  touch-action:pan-x pan-y !important;
  scrollbar-width:none !important;
}
.ccc-set-overview-slider-track::-webkit-scrollbar{ display:none !important; }
.ccc-set-overview-slide{
  flex:0 0 100% !important;
  width:100% !important;
  min-width:100% !important;
  max-width:100% !important;
  scroll-snap-align:start !important;
  padding:0 !important;
}
.ccc-set-overview-slide .ccc-set-overview-section,
.ccc-set-overview-section--subsets,
.ccc-set-overview-section--owners{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  max-height:138px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain !important;
  -webkit-overflow-scrolling:touch !important;
  touch-action:pan-y !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pillrow,
.ccc-set-overview-section--owners .ccc-set-overview-pillrow{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  overflow:visible !important;
  max-height:none !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pill.is-hidden,
.ccc-set-overview-section--owners .ccc-set-overview-pill.is-hidden{
  display:inline-flex !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-more,
.ccc-set-overview-section--owners .ccc-set-overview-more{
  display:none !important;
}
.ccc-set-overview-dots{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:7px !important;
  min-height:12px !important;
  padding:0 0 1px !important;
}
.ccc-set-overview-dot{
  appearance:none !important;
  -webkit-appearance:none !important;
  width:7px !important;
  height:7px !important;
  padding:0 !important;
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.35) !important;
  background:rgba(255,255,255,.12) !important;
  cursor:pointer !important;
}
.ccc-set-overview-dot.is-active,
.ccc-set-overview-dot[aria-current="true"]{
  width:18px !important;
  background:rgba(154,139,255,.72) !important;
  border-color:rgba(154,139,255,.85) !important;
}
.ccc-set-overview-dots:has(.ccc-set-overview-dot:only-child){ display:none !important; }
@media (max-width:620px){
  .ccc-set-overview-card[data-expanded="true"] .ccc-set-overview-expand,
  .ccc-set-overview-card[aria-expanded="true"] .ccc-set-overview-expand{
    max-height:300px !important;
  }
  .ccc-set-overview-slide .ccc-set-overview-section,
  .ccc-set-overview-section--subsets,
  .ccc-set-overview-section--owners{
    max-height:128px !important;
  }
}

/* === SOURCE: 080-ccc-set-overview-slider-swipe-input-v13.css === */
/* v13: allow real horizontal swipes on phones and horizontal trackpad swipes on desktop. */
.ccc-set-overview-slider,
.ccc-set-overview-slider-track,
.ccc-set-overview-slide{
  touch-action: pan-x pan-y !important;
}
.ccc-set-overview-slider .ccc-set-overview-section,
.ccc-set-overview-slider .ccc-set-overview-pillrow,
.ccc-set-overview-slider .ccc-set-overview-pill{
  touch-action: pan-x pan-y !important;
}
.ccc-set-overview-slider-track{
  scroll-snap-type: x mandatory !important;
}
.ccc-set-overview-slide{
  scroll-snap-stop: always !important;
}

/* === SOURCE: 081-ccc-set-overview-slider-arrows-v15.css === */
/* v15: clean arrow-only slider controls. */
.ccc-set-overview-slider-nav{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
  width:100% !important;
  margin:2px 0 6px !important;
}
.ccc-set-overview-slider-hint{
  display:none !important;
}
.ccc-set-overview-slider-arrow{
  appearance:none !important;
  -webkit-appearance:none !important;
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  min-height:34px !important;
  padding:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(255,255,255,.22) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.07) !important;
  color:#ffffff !important;
  font-size:24px !important;
  font-weight:800 !important;
  line-height:1 !important;
  cursor:pointer !important;
  box-shadow:0 8px 22px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.04) !important;
  transition:border-color .18s ease, background .18s ease, opacity .18s ease, transform .18s ease, box-shadow .18s ease !important;
}
.ccc-set-overview-slider-arrow:hover,
.ccc-set-overview-slider-arrow:focus-visible{
  border-color:rgba(255,255,255,.55) !important;
  background:rgba(255,255,255,.13) !important;
  box-shadow:0 10px 26px rgba(0,0,0,.30), inset 0 0 0 1px rgba(255,255,255,.08) !important;
}
.ccc-set-overview-slider-arrow:active{ transform:translateY(1px) scale(.96) !important; }
.ccc-set-overview-slider-arrow[disabled]{ opacity:.28 !important; cursor:default !important; pointer-events:none !important; }
.ccc-set-overview-slider-track{
  scroll-snap-type:x proximity !important;
  cursor:grab !important;
}
.ccc-set-overview-slider-track:active{ cursor:grabbing !important; }
@media (max-width:620px){
  .ccc-set-overview-slider-nav{ gap:10px !important; margin:1px 0 5px !important; }
  .ccc-set-overview-slider-arrow{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;
    font-size:23px !important;
  }
}

/* === SOURCE: 082-ccc-mobile-browse-set-cutoff-fix.css === */
/* Mobile safety net: after a set is opened from Browse List, the results page must
   behave like a normal page again, not like the fixed Browse List panel. */
@media (max-width:780px){
  body:not(.browse-list-open) #result,
  body:not(.browse-list-open) .result{
    overflow:visible !important;
    max-height:none !important;
    min-height:auto !important;
    padding-bottom:calc(110px + env(safe-area-inset-bottom, 0px)) !important;
  }
  body:not(.browse-list-open) .container{
    overflow:visible !important;
    max-height:none !important;
  }
}

/* === SOURCE: 083-ccc-set-overview-bottom-dot-controls-v16.css === */
/* v16: remove the large arrow controls. Keep the cleaner bottom dots under the
   scrollable Subsets/Owners window and make them slightly larger/easier to tap. */
.ccc-set-overview-slider-nav{
  display:none !important;
}
.ccc-set-overview-dots{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:10px !important;
  min-height:24px !important;
  margin:8px 0 2px !important;
  padding:4px 0 2px !important;
}
.ccc-set-overview-dot{
  appearance:none !important;
  -webkit-appearance:none !important;
  width:12px !important;
  height:12px !important;
  min-width:12px !important;
  min-height:12px !important;
  padding:0 !important;
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.42) !important;
  background:rgba(255,255,255,.16) !important;
  cursor:pointer !important;
  box-shadow:0 3px 10px rgba(0,0,0,.18) !important;
  transition:width .18s ease, background .18s ease, border-color .18s ease, transform .18s ease !important;
}
.ccc-set-overview-dot:hover,
.ccc-set-overview-dot:focus-visible{
  border-color:rgba(255,255,255,.70) !important;
  background:rgba(255,255,255,.26) !important;
  outline:none !important;
  transform:translateY(-1px) !important;
}
.ccc-set-overview-dot.is-active,
.ccc-set-overview-dot[aria-current="true"]{
  width:30px !important;
  min-width:30px !important;
  height:12px !important;
  background:rgba(154,139,255,.78) !important;
  border-color:rgba(154,139,255,.92) !important;
}
.ccc-set-overview-dots:has(.ccc-set-overview-dot:only-child){
  display:none !important;
}
@media (max-width:620px){
  .ccc-set-overview-dots{
    gap:11px !important;
    min-height:28px !important;
    margin:9px 0 3px !important;
    padding:5px 0 3px !important;
  }
  .ccc-set-overview-dot{
    width:13px !important;
    height:13px !important;
    min-width:13px !important;
    min-height:13px !important;
  }
  .ccc-set-overview-dot.is-active,
  .ccc-set-overview-dot[aria-current="true"]{
    width:34px !important;
    min-width:34px !important;
    height:13px !important;
  }
}

/* === SOURCE: 084-ccc-set-overview-remove-subset-owner-windows.css === */
/* User update: remove the Subset scrollable window, Owner scrollable window,
   and the slide/dot controls beneath the stats row. Keep only the set overview stats. */
.ccc-set-overview-card .ccc-set-overview-dots,
.ccc-set-overview-card .ccc-set-overview-slider,
.ccc-set-overview-card .ccc-set-overview-slider-track,
.ccc-set-overview-card .ccc-set-overview-slide,
.ccc-set-overview-card .ccc-set-overview-section--subsets,
.ccc-set-overview-card .ccc-set-overview-section--owners{
  display: none !important;
}
.ccc-set-overview-card[data-expanded="true"] .ccc-set-overview-expand,
.ccc-set-overview-card[aria-expanded="true"] .ccc-set-overview-expand{
  max-height: none !important;
  overflow: visible !important;
}
.ccc-set-overview-card .ccc-set-overview-expand{
  gap: 8px !important;
}

/* === SOURCE: 085-ccc-issue-series-and-members-refresh.css === */
/* Comic book issue list header: keep the same set-overview card shell and keep the key stats in one compact row. */
.ccc-issue-series-overview-card{
  width:min(520px, 100%);
}
.ccc-issue-series-overview-card .ccc-set-overview-expand{
  gap:8px !important;
}
.ccc-issue-series-overview-grid{
  grid-template-columns:minmax(58px,.55fr) minmax(78px,.75fr) minmax(74px,.70fr) minmax(0,1.55fr) !important;
  gap:8px !important;
  align-items:stretch;
}
.ccc-issue-series-overview-grid .ccc-set-overview-stat{
  min-width:0;
}
.ccc-issue-series-overview-grid .ccc-set-overview-stat:nth-child(4) strong{
  font-size:12px !important;
}
.ccc-issue-series-overview-section--sets .ccc-set-overview-pill{
  cursor:default;
}
.ccc-issue-series-overview-section--sets .ccc-set-overview-pill::before{
  content:'collections_bookmark';
}

/* Make 1CC member cards read like the collection overview cards, including award icons. */
.mc-members-list .mc-member-card{
  min-height:72px;
}
.mc-members-list .mc-profile-left{
  min-width:0;
}
.mc-members-list .mc-profile-name{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.mc-members-list .mc-cuts-pill{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:8px;
}
.mc-members-list .mc-cuts-award-icons{
  margin-left:4px;
}
@media (max-width:780px){
  .ccc-issue-series-overview-grid{
    grid-template-columns:minmax(38px,.50fr) minmax(60px,.72fr) minmax(56px,.66fr) minmax(0,1.35fr) !important;
    gap:4px !important;
  }
  .ccc-issue-series-overview-grid .ccc-set-overview-stat{
    padding:5px 5px !important;
  }
  .ccc-issue-series-overview-grid .ccc-set-overview-stat label{
    font-size:7px !important;
    letter-spacing:.035em !important;
    white-space:normal !important;
    text-align:center;
  }
  .ccc-issue-series-overview-grid .ccc-set-overview-stat strong{
    font-size:10px !important;
    line-height:1.1 !important;
    text-align:center;
  }
  .ccc-issue-series-overview-grid .ccc-set-overview-stat:nth-child(4) strong{
    font-size:9px !important;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    line-clamp:2;
    overflow:hidden;
  }
  .mc-members-list{
    grid-template-columns:1fr;
    max-width:100%;
  }
  .mc-members-list .mc-member-card{
    width:100%;
  }
}
@media (max-width:520px){
  .mc-members-list .mc-member-card{
    padding:10px 10px;
  }
  .mc-members-list .mc-cuts-pill{
    gap:6px;
  }
}

/* === SOURCE: 086-ccc-mobile-header-and-set-overview-fix.css === */
/* Mobile fix: the fixed app header must be solid, not glass/transparent, so scrolled
   dropdowns/cards cannot show through it on My Collection grid view or Comic Cut Tools. */
@media (max-width:780px){
  .topbar{
    background:#101114 !important;
    background-image:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    border-bottom:1px solid rgba(255,255,255,.12) !important;
    box-shadow:0 8px 22px rgba(0,0,0,.55) !important;
    z-index:3000 !important;
  }

  /* Keep every set-overview stat on one row on phones: Sets / Signature / Total Cards / Most Used Issue. */
  .ccc-set-overview-grid,
  .ccc-issue-series-overview-grid{
    grid-template-columns:minmax(38px,.55fr) minmax(54px,.7fr) minmax(52px,.7fr) minmax(0,1.55fr) !important;
    gap:5px !important;
  }
  .ccc-set-overview-stat,
  .ccc-issue-series-overview-grid .ccc-set-overview-stat{
    grid-column:auto !important;
    padding:6px 5px !important;
    gap:2px !important;
  }
  .ccc-set-overview-stat label,
  .ccc-issue-series-overview-grid .ccc-set-overview-stat label{
    font-size:7px !important;
    letter-spacing:.035em !important;
    white-space:normal !important;
    line-height:1.05 !important;
  }
  .ccc-set-overview-stat strong,
  .ccc-issue-series-overview-grid .ccc-set-overview-stat strong{
    font-size:10px !important;
    line-height:1.1 !important;
  }
  .ccc-set-overview-stat:nth-child(4) strong,
  .ccc-issue-series-overview-grid .ccc-set-overview-stat:nth-child(4) strong{
    font-size:9px !important;
    line-height:1.08 !important;
  }
}

/* === SOURCE: 087-ccc-set-header-one-row-final-fix.css === */
/* Final mobile patch: Set overview detail header matches the Comic Book Issue header.
   Keep Sets / Signature / Total Cards / Most Used Issue on one single row,
   overriding older nth-child mobile rules that made Total Cards span full width. */
@media (max-width:780px){
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid{
    display:grid !important;
    grid-template-columns:minmax(34px,.48fr) minmax(52px,.66fr) minmax(52px,.68fr) minmax(0,1.48fr) !important;
    gap:4px !important;
    align-items:stretch !important;
    width:100% !important;
    min-width:0 !important;
  }
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid .ccc-set-overview-stat,
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid .ccc-set-overview-stat:nth-child(1),
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid .ccc-set-overview-stat:nth-child(2),
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid .ccc-set-overview-stat:nth-child(3),
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid .ccc-set-overview-stat:nth-child(4){
    grid-column:auto !important;
    min-width:0 !important;
    padding:5px 4px !important;
    gap:2px !important;
  }
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid .ccc-set-overview-stat label{
    font-size:7px !important;
    letter-spacing:.025em !important;
    white-space:normal !important;
    line-height:1.05 !important;
    text-align:center !important;
  }
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid .ccc-set-overview-stat strong,
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid .ccc-set-overview-stat:nth-child(3) strong{
    display:block !important;
    font-size:10px !important;
    line-height:1.08 !important;
    text-align:center !important;
    min-width:0 !important;
  }
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid .ccc-set-overview-stat:nth-child(4) strong{
    font-size:9px !important;
    white-space:normal !important;
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    line-clamp:2 !important;
    overflow:hidden !important;
  }
}

/* === SOURCE: 088-ccc-full-header-name-fit-patch.css === */
/* Keep full set / comic book issue names visible in headers and overlays.
   No ellipsis/clamping; font sizing below shrinks text to fit the available box. */
.mc-issue-overlay-title,
.mini-popover-cardnum,
.ccc-set-overview-card .mc-profile-name,
.ccc-set-overview-card .ccc-set-overview-stat strong,
.ccc-issue-series-overview-card .ccc-set-overview-stat strong,
.trade-page-preview-copy strong,
.trade-page-preview-copy span{
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  display: block !important;
  -webkit-box-orient: initial !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
}

/* The fit script controls the font size. Keep line-height tight enough for long names. */
.mc-issue-overlay-title,
.mini-popover-cardnum{
  line-height: 1.08 !important;
}

/* Desktop + mobile: let the “Most Used Issue”/set overview header text shrink instead of clipping. */
.ccc-set-overview-card .ccc-set-overview-stat:nth-child(4) strong,
.ccc-issue-series-overview-card .ccc-set-overview-stat:nth-child(4) strong{
  font-size: clamp(6px, 1.05vw, 12px) !important;
  line-height: 1.05 !important;
}

/* === SOURCE: 210-database-page.css === */
/* Public Database page: genre filters and set-image grid. */
.ccc-database-page{
  width:min(1220px, calc(100% - 32px));
  margin:0 auto 52px;
  padding:8px 0 28px;
}
.ccc-database-heading{
  text-align:center;
  margin:0 0 16px;
}
.ccc-database-heading h1{
  margin:0;
  font-size:clamp(24px, 3vw, 34px);
  line-height:1.15;
}
.ccc-database-heading p{
  margin:7px 0 0;
  color:var(--muted);
  font-size:14px;
}
.ccc-database-genres{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  margin:0 0 20px;
}
.ccc-database-genre-btn{
  min-height:36px;
  padding:7px 13px;
  border:1px solid var(--border);
  border-radius:999px;
  background:rgba(255,255,255,.025);
  color:var(--text);
  font:inherit;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  transition:border-color .16s ease, background .16s ease, transform .16s ease;
}
.ccc-database-genre-btn:hover,
.ccc-database-genre-btn:focus-visible,
.ccc-database-genre-btn.is-active{
  border-color:rgba(255,255,255,.62);
  background:rgba(255,255,255,.11);
}
.ccc-database-genre-btn:active{
  transform:translateY(1px);
}
.ccc-database-grid{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:18px 14px;
  align-items:start;
}
a.ccc-database-set{
  display:block;
  min-width:0;
  color:inherit;
  text-decoration:none;
  border-radius:14px;
  outline:none;
}
.ccc-database-set-image{
  position:relative;
  width:100%;
  aspect-ratio:4 / 3;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:13px;
  background:rgba(255,255,255,.025);
  transition:border-color .16s ease, transform .16s ease, background .16s ease;
}
.ccc-database-set:hover .ccc-database-set-image,
.ccc-database-set:focus-visible .ccc-database-set-image{
  border-color:rgba(255,255,255,.58);
  background:rgba(255,255,255,.06);
  transform:translateY(-1px);
}
.ccc-database-set-image img{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.ccc-database-set-placeholder{
  position:absolute;
  inset:0;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:10px;
  text-align:center;
  color:var(--muted);
}
.ccc-database-set-placeholder .material-symbols-outlined{
  font-size:30px;
  opacity:.82;
}
.ccc-database-placeholder-label{
  color:var(--text);
  font-size:12px;
  font-weight:600;
}
.ccc-database-placeholder-file{
  max-width:100%;
  font-size:10px;
  line-height:1.25;
  overflow-wrap:anywhere;
  opacity:.72;
}
.ccc-database-set-image.has-image .ccc-database-set-placeholder{
  display:none;
}
.ccc-database-set-name{
  margin-top:8px;
  min-height:2.6em;
  padding:0 2px;
  color:var(--text);
  font-size:13px;
  font-weight:600;
  line-height:1.3;
  text-align:center;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
@media (max-width:780px){
  .ccc-database-page{
    width:calc(100% - 20px);
    margin-bottom:40px;
    padding-top:2px;
  }
  .ccc-database-heading{
    margin-bottom:13px;
  }
  .ccc-database-heading h1{
    font-size:24px;
  }
  .ccc-database-heading p{
    font-size:13px;
  }
  .ccc-database-genres{
    justify-content:flex-start;
    flex-wrap:nowrap;
    gap:7px;
    overflow-x:auto;
    margin:0 -2px 16px;
    padding:0 2px 5px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .ccc-database-genres::-webkit-scrollbar{
    display:none;
  }
  .ccc-database-genre-btn{
    flex:0 0 auto;
    min-height:34px;
    padding:6px 11px;
    font-size:12px;
  }
  .ccc-database-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:15px 8px;
  }
  .ccc-database-set-image{
    border-radius:10px;
  }
  .ccc-database-set-placeholder{
    gap:3px;
    padding:6px;
  }
  .ccc-database-set-placeholder .material-symbols-outlined{
    font-size:24px;
  }
  .ccc-database-placeholder-label{
    font-size:10px;
  }
  .ccc-database-placeholder-file{
    font-size:8px;
  }
  .ccc-database-set-name{
    margin-top:6px;
    min-height:2.7em;
    font-size:11px;
    line-height:1.35;
  }
}


/* Database loading state. This is displayed while the real collection-data
   promise resolves, so Browse Sets never remains in a half-open Browse List state. */
.ccc-database-loading{
  min-height:clamp(260px, 46vh, 520px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:28px 16px;
  box-sizing:border-box;
  color:var(--muted);
  text-align:center;
}
.ccc-database-loading strong{
  color:var(--text);
  font-size:15px;
  font-weight:900;
}
.ccc-database-loading > span:last-child{
  font-size:12px;
  line-height:1.35;
}
.ccc-database-loading-icon{
  color:var(--text);
  font-size:30px;
  animation:ccc-database-loading-spin .9s linear infinite;
}
@keyframes ccc-database-loading-spin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){
  .ccc-database-loading-icon{ animation:none; }
}

/* === SOURCE: 218-home-browse-actions.css === */
/* Homepage browse/action buttons.
   Match the exact mobile full-detail Previous / Checklist / Next action style,
   but keep four equal actions on the Home page at every viewport size. */
.home-browse-actions{
  box-sizing:border-box !important;
  width:min(680px, 100%) !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:32px auto 8px !important;
  padding:0 2px !important;
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  align-items:start !important;
  justify-items:stretch !important;
  column-gap:4px !important;
  row-gap:0 !important;
  overflow:visible !important;
}

html body .home-browse-actions > .home-browse-action-btn{
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:7px !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:auto !important;
  min-height:86px !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 1px !important;
  border:0 !important;
  border-bottom:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--text) !important;
  box-shadow:none !important;
  opacity:1 !important;
  overflow:visible !important;
  text-align:center !important;
  text-decoration:none !important;
  white-space:normal !important;
  cursor:pointer !important;
  transform:none !important;
  transition:none !important;
  font:inherit !important;
  outline:none !important;
}

html body .home-browse-actions .home-browse-action-circle,
html body .home-browse-actions .ccc-main-action-circle{
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 56px !important;
  width:56px !important;
  height:56px !important;
  min-width:56px !important;
  min-height:56px !important;
  max-width:56px !important;
  max-height:56px !important;
  margin:0 !important;
  padding:0 !important;
  border:1px solid rgba(255,255,255,.16) !important;
  border-radius:50% !important;
  background:rgba(255,255,255,.075) !important;
  color:var(--text) !important;
  box-shadow:none !important;
  overflow:hidden !important;
  transform:none !important;
  transition:border-color .15s ease, background .15s ease !important;
}

html body .home-browse-actions .home-browse-action-circle .material-symbols-outlined,
html body .home-browse-actions .ccc-main-action-circle .material-symbols-outlined{
  display:block !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  color:inherit !important;
  font-size:27px !important;
  line-height:1 !important;
}

html body .home-browse-actions .home-browse-action-label,
html body .home-browse-actions .ccc-main-action-label{
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:0 !important;
  width:100% !important;
  min-width:0 !important;
  min-height:2.2em !important;
  margin:0 !important;
  padding:0 !important;
  color:var(--text) !important;
  font-size:11px !important;
  font-weight:650 !important;
  line-height:1.1 !important;
  letter-spacing:0 !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}

html body .home-browse-actions .home-browse-action-label > span,
html body .home-browse-actions .ccc-main-action-label > span{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}

html body .home-browse-actions .home-browse-action-label > .home-responsive-action-text,
html body .home-browse-actions .ccc-main-action-label > .home-responsive-action-text{
  white-space:nowrap !important;
}
html body .home-browse-actions .home-responsive-action-text > .home-action-word{
  display:inline !important;
}
html body .home-browse-actions .home-responsive-action-text > .home-action-word + .home-action-word::before{
  content:" " !important;
}

@media (hover: hover) and (pointer: fine){

html body .home-browse-actions > .home-browse-action-btn:hover:not(:disabled){
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:none !important;
  transform:none !important;
}
}

html body .home-browse-actions > .home-browse-action-btn:focus-visible,
html body .home-browse-actions > .home-browse-action-btn:active{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:none !important;
  transform:none !important;
}

html body .home-browse-actions > .home-browse-action-btn:focus-visible .home-browse-action-circle,
html body .home-browse-actions > .home-browse-action-btn:active .home-browse-action-circle{
  border-color:rgba(255,255,255,.5) !important;
  background:rgba(255,255,255,.12) !important;
}
@media (min-width:781px){
  @media (hover: hover) and (pointer: fine){
  html body .home-browse-actions > .home-browse-action-btn:not(:disabled):not([aria-disabled="true"]):not(.is-home-disabled) .home-browse-action-circle:hover{
    border-color:#fff !important;
    background:rgba(255,255,255,.12) !important;
  }
  }
}

/* Logged-out Price Guide: same action geometry, muted exactly at the icon/label level. */
html body .home-browse-actions > .home-browse-action-btn:disabled,
html body .home-browse-actions > .home-browse-action-btn[aria-disabled="true"],
html body .home-browse-actions > .home-browse-action-btn.is-home-disabled{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  transform:none !important;
  opacity:1 !important;
  filter:none !important;
  cursor:default !important;
  pointer-events:none !important;
}
html body .home-browse-actions > .home-browse-action-btn:disabled .home-browse-action-circle,
html body .home-browse-actions > .home-browse-action-btn[aria-disabled="true"] .home-browse-action-circle,
html body .home-browse-actions > .home-browse-action-btn.is-home-disabled .home-browse-action-circle{
  border-color:rgba(180,184,196,.16) !important;
  background:rgba(112,116,128,.14) !important;
  color:rgba(188,192,204,.42) !important;
  filter:grayscale(1) !important;
}
html body .home-browse-actions > .home-browse-action-btn:disabled .home-browse-action-label,
html body .home-browse-actions > .home-browse-action-btn[aria-disabled="true"] .home-browse-action-label,
html body .home-browse-actions > .home-browse-action-btn.is-home-disabled .home-browse-action-label,
html body .home-browse-actions > .home-browse-action-btn:disabled .material-symbols-outlined,
html body .home-browse-actions > .home-browse-action-btn[aria-disabled="true"] .material-symbols-outlined,
html body .home-browse-actions > .home-browse-action-btn.is-home-disabled .material-symbols-outlined{
  color:rgba(188,192,204,.42) !important;
  opacity:1 !important;
}

/* Browse by Comic Book: reuse the exact Checklist -> Comic Books mini grid.
   Each series uses a normal .mini-row cover tile, with the title/count below it. */
.ccc-comic-book-alpha-section{
  margin:0 0 26px;
}
.ccc-comic-book-alpha-heading{
  margin:0 0 10px;
  padding:0 2px 7px;
  border-bottom:1px solid var(--border);
  color:var(--text);
  font-size:18px;
  font-weight:800;
  line-height:1;
}
.ccc-comic-book-browser-page .ccc-comic-book-series-grid{
  /* .mini-results owns the actual responsive grid dimensions. */
  margin-top:0;
  align-items:start;
}
.ccc-comic-book-series-item{
  min-width:0;
  width:100%;
}
a.ccc-comic-book-series.mini-row{
  display:grid;
  width:100%;
  aspect-ratio:3 / 4;
  margin:0;
  color:inherit;
  text-decoration:none;
}
a.ccc-comic-book-series.mini-row .mini-tile-img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.ccc-comic-book-series-placeholder{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.04);
  color:var(--muted);
}
.ccc-comic-book-series-placeholder .material-symbols-outlined{
  font-size:30px;
  opacity:.75;
}
.ccc-comic-book-series-name{
  margin-top:6px;
  padding:0 2px;
  min-height:2.5em;
  color:var(--text);
  font-size:11px;
  font-weight:600;
  line-height:1.25;
  text-align:center;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
.ccc-comic-book-series-meta{
  margin-top:3px;
  color:var(--muted);
  font-size:10px;
  line-height:1.2;
  text-align:center;
}

@media (max-width:780px){
  html body .home-browse-actions .home-browse-action-label > .home-responsive-action-text,
  html body .home-browse-actions .ccc-main-action-label > .home-responsive-action-text{white-space:normal !important;}
  html body .home-browse-actions .home-responsive-action-text > .home-action-word{display:block !important;}
  html body .home-browse-actions .home-responsive-action-text > .home-action-word + .home-action-word::before{content:none !important;}
}

@media (max-width:520px){
  .home-browse-actions{
    width:100% !important;
  }
  .ccc-comic-book-alpha-section{ margin-bottom:22px; }
  .ccc-comic-book-alpha-heading{ font-size:16px; margin-bottom:9px; }
  .ccc-comic-book-series-name{
    margin-top:5px;
    font-size:10px;
    line-height:1.2;
  }
  .ccc-comic-book-series-meta{
    margin-top:2px;
    font-size:9px;
  }
}

/* Mobile Browse by Comic Book intentionally inherits the exact Checklist
   .mini-results / .mini-row sizing. Do not override columns, gap, radius,
   aspect ratio, or image dimensions here. */
@media (max-width:780px), (hover:none) and (pointer:coarse){
  .ccc-comic-book-browser-page .ccc-comic-book-series-grid > .ccc-comic-book-series.mini-row{
    min-width:0;
  }
}


/* Mobile Browse by Comic Book: desktop grouping/behavior, fixed 3 issue covers per row. */
@media (max-width:780px){
  .ccc-comic-book-browser-page .ccc-mobile-comic-series-block{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
  }
  .ccc-comic-book-browser-page .ccc-mobile-comic-series-title{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }
  .ccc-comic-book-browser-page .ccc-mobile-comic-issue-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    grid-auto-flow:row !important;
    grid-auto-columns:auto !important;
    gap:8px !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:visible !important;
  }
  .ccc-comic-book-browser-page .ccc-mobile-comic-issue-grid > .ccc-mobile-comic-issue-tile{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    border-radius:8px !important;
  }
  .ccc-comic-book-browser-page .ccc-mobile-comic-issue-tile > img{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    aspect-ratio:3/4 !important;
    object-fit:cover !important;
    margin:0 !important;
  }
}

/* === SOURCE: 089-mc-gallery-remove-shell-final.css === */
/* Remove the outer gallery panel/shell entirely */
.mc-gallery-card,
.mc-gallery-slide.near .mc-gallery-card,
.mc-gallery-slide.active .mc-gallery-card{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: visible !important;
}
.mc-gallery-card::before{
  content: none !important;
  display: none !important;
}
/* Remove the reflected shell as well so no box appears underneath */
.mc-gallery-card::after{
  content: none !important;
  display: none !important;
}
.mc-gallery-meta{
  background: transparent !important;
  border-top: 0 !important;
  border-radius: 0 !important;
  padding-top: 12px !important;
}
.mc-gallery-card img{
  background: transparent !important;
  border-radius: 0 !important;
}

/* === SOURCE: 090-price-guide-feature-styles.css === */
/* Price Guide tab + mobile-scrolling My Collection tabs */
.mc-tabs{
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.mc-tabs::-webkit-scrollbar{ display:none; }
.mc-tabs .mc-tab{ flex:0 0 auto; white-space:nowrap; }
@media (max-width:780px){
  .mc-tabs{
    justify-content:flex-start !important;
    gap:16px;
    padding:0 16px 2px;
    margin-left:-16px;
    margin-right:-16px;
    scroll-snap-type:x proximity;
  }
  .mc-tabs .mc-tab{ scroll-snap-align:start; }
}
.mc-price-guide{
  width:100%;
  max-width:1160px;
  margin:10px auto 0;
  display:grid;
  gap:14px;
}
.mc-price-chart-card{
  width:100%;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  box-shadow:var(--shadow);
  padding:14px;
  display:grid;
  gap:12px;
}
.mc-price-chart-title{
  font-size:15px;
  font-weight:800;
  letter-spacing:.02em;
}
.mc-price-chart-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-width:0;
}
.mc-price-chart-title-row .mc-price-chart-title{
  min-width:0;
  overflow-wrap:anywhere;
}
.mc-price-info-btn{
  appearance:none;
  -webkit-appearance:none;
  flex:0 0 auto;
  width:32px;
  height:32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  color:var(--text);
  cursor:pointer;
  border-radius:999px;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}
.mc-price-info-btn:hover{
  border-color:rgba(255,255,255,.45);
  background:rgba(255,255,255,.09);
  transform:translateY(-1px);
}
.mc-price-info-btn:active{
  transform:translateY(0) scale(.98);
}
.mc-price-info-btn .material-symbols-outlined{
  font-size:19px;
  line-height:1;
}
.mc-price-chart-empty{
  min-height:170px;
  display:grid;
  place-items:center;
  color:var(--muted);
  text-align:center;
  border:1px dashed rgba(255,255,255,.12);
  padding:18px;
}
.mc-price-chart-wrap{ width:100%; overflow-x:auto; }
.mc-price-chart-wrap svg{ width:100%; min-width:520px; height:auto; display:block; }
.mc-price-axis{ stroke:rgba(255,255,255,.20); stroke-width:1; }
.mc-price-axis-label{ fill:rgba(255,255,255,.62); font-size:11px; font-weight:700; }
.mc-price-line{ fill:none; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.mc-price-line.paid{ stroke:rgba(154,139,255,.95); }
.mc-price-line.estimate{ stroke:rgba(0,255,209,.85); }
.mc-price-dot.paid{ fill:rgba(154,139,255,.95); }
.mc-price-dot.estimate{ fill:rgba(0,255,209,.85); }
.mc-price-legend{ display:flex; gap:14px; flex-wrap:wrap; color:var(--muted); font-size:12px; font-weight:700; }
.mc-price-legend span{ display:inline-flex; align-items:center; gap:6px; }
.mc-price-legend i{ width:10px; height:10px; display:inline-block; border-radius:999px; }
.mc-price-legend i.paid{ background:rgba(154,139,255,.95); }
.mc-price-legend i.estimate{ background:rgba(0,255,209,.85); }
.mc-price-list{ width:100%; display:grid; gap:8px; }
.mc-price-head,
.mc-price-row{
  display:grid;
  grid-template-columns:64px 64px minmax(160px,1.6fr) minmax(76px,.65fr) repeat(4, minmax(84px,.75fr));
  gap:10px;
  align-items:center;
}
.mc-price-head{
  padding:0 8px 4px;
  color:var(--muted);
  font-size:10px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.mc-price-row{
  appearance:none;
  width:100%;
  text-align:left;
  color:var(--text);
  padding:10px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}
.mc-price-row:hover,
.mc-price-row.is-selected{
  border-color:rgba(255,255,255,.35);
  background:rgba(255,255,255,.07);
}
.mc-price-row.is-selected{ box-shadow:0 0 0 1px rgba(154,139,255,.32) inset; }
.mc-price-img{
  width:52px;
  aspect-ratio:3/4;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  color:var(--muted);
  font-size:12px;
}
.mc-price-img img{ width:100%; height:100%; object-fit:contain; display:block; }
.mc-price-issue,
.mc-price-sn,
.mc-price-money{
  min-width:0;
  font-size:12px;
  font-weight:700;
  overflow-wrap:anywhere;
}
.mc-price-sn{ color:var(--muted); }
.mc-price-money{ text-align:center; }
@media (max-width:780px){
  .mc-price-chart-card{ padding:12px; }
  .mc-price-list{ gap:8px; }
  .mc-price-head{ display:none; }
  .mc-price-row{
    grid-template-columns:54px 54px 1fr 1fr;
    gap:8px;
    align-items:center;
    padding:10px 8px;
  }
  .mc-price-img{ width:48px; grid-row:1 / span 2; }
  .mc-price-issue{ grid-column:3 / -1; font-size:12px; }
  .mc-price-sn{ grid-column:3 / 4; }
  .mc-price-money{ text-align:left; font-size:11px; }
  .mc-price-row .mc-price-money:nth-of-type(5)::before{ content:'Est: '; color:var(--muted); }
  .mc-price-row .mc-price-money:nth-of-type(6)::before{ content:'Paid: '; color:var(--muted); }
  .mc-price-row .mc-price-money:nth-of-type(7)::before{ content:'Avg Paid: '; color:var(--muted); }
  .mc-price-row .mc-price-money:nth-of-type(8)::before{ content:'Avg Est: '; color:var(--muted); }
}

/* === SOURCE: 091-price-guide-dropdown-patch-styles.css === */
/* Price Guide toolbar picker placement + disabled sort/filter states */
.mc-price-guide-picker-mount{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  align-items:flex-start;
  justify-content:center;
}
.mc-price-guide-picker-mount .mc-price-picker-row{
  max-width:none;
  justify-self:auto;
  justify-content:flex-start;
  z-index:40;
}
.mc-price-guide-picker-mount .mc-price-picker{
  max-width:none;
}
.mc-sort-icon-btn:disabled,
.mc-sort-icon-btn.is-disabled,
.mc-filters-toggle:disabled,
.mc-filters-toggle.is-disabled{
  opacity:.45;
  cursor:not-allowed;
  background:rgba(255,255,255,.03) !important;
  border-color:rgba(255,255,255,.16) !important;
  color:rgba(255,255,255,.55) !important;
  transform:none !important;
  pointer-events:none;
}
@media (max-width:560px){
  .mc-toolbar{ gap:7px; }
  .mc-price-guide-picker-mount .mc-price-picker-row{ gap:7px; }
}

/* ===== Price Guide dropdown selection patch styles ===== */
.mc-price-picker-row{width:100%;max-width:720px;justify-self:center;display:flex;align-items:flex-start;justify-content:center;gap:8px;position:relative;z-index:8;}
.mc-price-picker{position:relative;flex:1 1 auto;min-width:0;max-width:560px;z-index:5;}
.mc-price-picker-trigger{width:100%;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--border);background:rgba(255,255,255,.04);color:var(--text);cursor:pointer;font-size:13px;font-weight:800;text-align:left;}
.mc-price-picker-trigger:hover,.mc-price-picker-trigger[aria-expanded="true"]{border-color:rgba(154,139,255,.55);background:rgba(154,139,255,.16);}
.mc-price-picker-trigger .material-symbols-outlined{font-size:20px;flex:0 0 auto;}
.mc-price-deselect-btn{min-height:44px;width:44px;flex:0 0 44px;padding:0;border:1px solid var(--border);background:rgba(255,255,255,.04);color:var(--text);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;}
.mc-price-deselect-btn .material-symbols-outlined{font-size:22px;line-height:1;}
.mc-price-deselect-btn:hover:not(:disabled){border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.08);}
.mc-price-deselect-btn:disabled{opacity:.45;cursor:not-allowed;}
.mc-price-picker-panel{position:absolute;left:0;right:0;top:calc(100% + 6px);display:none;max-height:min(360px,56vh);overflow:auto;border:1px solid var(--border);background:linear-gradient(180deg,var(--panel) 0%,var(--panel-2) 100%);box-shadow:var(--shadow);padding:6px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;}
.mc-price-picker-panel.open{display:grid;gap:4px;position:relative;left:auto;right:auto;top:auto;margin-top:6px;width:100%;max-height:min(420px,58vh);}
.mc-price-picker-search-wrap{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:8px;margin:2px 0 6px;padding:7px 9px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg,var(--panel) 0%,var(--panel-2) 100%);}
.mc-price-picker-search-wrap .material-symbols-outlined{font-size:18px;color:var(--muted);}
.mc-price-picker-search{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--text);font-size:16px;font-weight:700;}
.mc-price-picker-search::placeholder{color:var(--muted);opacity:.82;}
.mc-price-picker-options{display:grid;gap:4px;}
.mc-price-picker-option{display:flex;align-items:center;gap:9px;min-height:38px;padding:8px 10px;color:var(--text);font-size:13px;font-weight:700;cursor:pointer;border-radius:10px;}
.mc-price-picker-option:hover{background:rgba(255,255,255,.07);}
.mc-price-picker-option input{accent-color:#9a8bff;}
.mc-price-picker-empty{padding:10px;color:var(--muted);font-size:13px;}
@media (max-width:560px){.mc-price-picker-row{align-items:stretch;gap:7px;}.mc-price-deselect-btn{width:44px;flex-basis:44px;padding:0;}.mc-price-picker-trigger{font-size:12px;}.mc-price-picker-panel.open{max-height:min(360px,52vh);}.mc-price-picker-option{min-height:42px;}}
@supports (height: 100dvh){.mc-price-picker-panel.open{max-height:min(420px,58dvh);}@media (max-width:560px){.mc-price-picker-panel.open{max-height:min(360px,52dvh);}}}

/* === SOURCE: 092-price-guide-mobile-polish-final.css === */
/* ===== Price Guide final polish: rounded picker, fixed mobile toolbar, wider dropdown, cleaner mobile rows ===== */
.mc-price-picker-trigger,
.mc-price-picker-panel,
.mc-price-picker-search-wrap,
.mc-price-deselect-btn{
  border-radius:14px !important;
}
.mc-price-picker-trigger{ overflow:hidden; }
.mc-price-deselect-btn{ box-shadow:none; }
.mc-price-picker-panel{ z-index:3000 !important; border-radius:16px !important; }

/* Keep the opened dropdown from adding height to the toolbar row. */
.mc-price-picker-panel.open{
  position:absolute !important;
  top:calc(100% + 8px) !important;
  left:0 !important;
  right:auto !important;
  width:100% !important;
  margin-top:0 !important;
  max-height:min(420px,58vh) !important;
  overflow:auto !important;
}

@media (max-width:560px){
  .mc-price-guide-picker-mount,
  .mc-price-guide-picker-mount .mc-price-picker-row,
  .mc-price-picker-row{ align-items:center !important; }

  .mc-price-picker-panel.open{
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
    width:min(94vw, 430px) !important;
    max-height:min(390px,56vh) !important;
    padding:8px !important;
  }
  .mc-price-picker-option{
    padding:10px 12px !important;
    gap:11px !important;
    font-size:13px !important;
    line-height:1.25 !important;
  }
  .mc-price-picker-search-wrap{ padding:9px 11px !important; }
}

@supports (height: 100dvh){
  .mc-price-picker-panel.open{ max-height:min(420px,58dvh) !important; }
  @media (max-width:560px){ .mc-price-picker-panel.open{ max-height:min(390px,56dvh) !important; } }
}

/* Mobile Price Guide rows: keep every text value to the right of Image B. */
@media (max-width:780px){
  .mc-price-row{
    grid-template-columns:48px 48px minmax(0,1fr) !important;
    grid-auto-rows:auto !important;
    gap:6px 8px !important;
    align-items:start !important;
    padding:10px 8px !important;
  }
  .mc-price-row > .mc-price-img:nth-child(1){ grid-column:1 !important; grid-row:1 / span 6 !important; }
  .mc-price-row > .mc-price-img:nth-child(2){ grid-column:2 !important; grid-row:1 / span 6 !important; }
  .mc-price-img{ width:48px !important; max-width:48px !important; }
  .mc-price-issue,
  .mc-price-sn,
  .mc-price-money{
    grid-column:3 / 4 !important;
    min-width:0 !important;
    text-align:left !important;
    line-height:1.25 !important;
  }
  .mc-price-issue{ font-size:12px !important; font-weight:800 !important; }
  .mc-price-sn,
  .mc-price-money{ font-size:11px !important; }
  .mc-price-money::before{ display:inline !important; font-weight:800 !important; }
}

/* === SOURCE: 093-price-guide-mobile-dropdown-alignment-fix.css === */
/* Align the mobile Select Comic dropdown panel with the left edge of the toolbar/filter button. */
@media (max-width:560px){
  .mc-toolbar{
    position:relative !important;
    align-items:center !important;
    overflow:visible !important;
  }
  .mc-price-guide-picker-mount,
  .mc-price-guide-picker-mount .mc-price-picker-row,
  .mc-price-picker-row,
  .mc-price-picker{
    overflow:visible !important;
  }
  .mc-price-guide-picker-mount .mc-price-picker-panel.open,
  .mc-price-picker-panel.open{
    left:calc(-44px - 7px) !important;
    right:auto !important;
    transform:none !important;
    width:min(calc(100vw - 32px), 430px) !important;
    max-width:calc(100vw - 32px) !important;
    box-sizing:border-box !important;
  }
}

/* === SOURCE: 094-price-guide-mobile-two-column-row-fix.css === */
/* Price Guide mobile row layout: images on the left, details in two clean columns. */
@media (max-width:780px){
  .mc-price-row{
    grid-template-columns:48px 48px minmax(0,1fr) minmax(0,1fr) !important;
    grid-auto-rows:auto !important;
    gap:6px 8px !important;
    align-items:start !important;
    padding:10px 8px !important;
  }
  .mc-price-row > .mc-price-img:nth-child(1){ grid-column:1 !important; grid-row:1 / span 3 !important; }
  .mc-price-row > .mc-price-img:nth-child(2){ grid-column:2 !important; grid-row:1 / span 3 !important; }
  .mc-price-row .mc-price-img{ width:48px !important; max-width:48px !important; }
  .mc-price-row > .mc-price-issue{
    grid-column:3 / 5 !important;
    grid-row:1 !important;
    font-size:12px !important;
    font-weight:800 !important;
    line-height:1.25 !important;
    text-align:left !important;
    min-width:0 !important;
    overflow-wrap:anywhere !important;
  }
  .mc-price-row > .mc-price-sn{ display:none !important; }
  .mc-price-row > .mc-price-money{
    min-width:0 !important;
    text-align:left !important;
    font-size:11px !important;
    line-height:1.22 !important;
    font-weight:700 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }
  .mc-price-row > .mc-price-money:nth-child(6){ grid-column:3 !important; grid-row:2 !important; }
  .mc-price-row > .mc-price-money:nth-child(5){ grid-column:4 !important; grid-row:2 !important; }
  .mc-price-row > .mc-price-money:nth-child(7){ grid-column:3 !important; grid-row:3 !important; }
  .mc-price-row > .mc-price-money:nth-child(8){ grid-column:4 !important; grid-row:3 !important; }
  .mc-price-row > .mc-price-money::before{
    display:inline !important;
    color:var(--muted) !important;
    font-weight:800 !important;
  }
  .mc-price-row > .mc-price-money:nth-child(6)::before{ content:'Paid: ' !important; }
  .mc-price-row > .mc-price-money:nth-child(5)::before{ content:'Est: ' !important; }
  .mc-price-row > .mc-price-money:nth-child(7)::before{ content:'Avg. Paid: ' !important; }
  .mc-price-row > .mc-price-money:nth-child(8)::before{ content:'Avg. Est: ' !important; }
}

/* === SOURCE: 095-price-guide-mobile-issue-own-line-fix.css === */
/* Price Guide mobile rows: issue gets its own full line; values below are two columns. */
.mc-price-mobile-details{ display:none; }
@media (max-width:780px){
  .mc-price-row{
    grid-template-columns:48px 48px minmax(0,1fr) !important;
    grid-auto-rows:auto !important;
    gap:6px 8px !important;
    align-items:start !important;
  }
  .mc-price-row > .mc-price-img:nth-child(1){ grid-column:1 !important; grid-row:1 / span 3 !important; }
  .mc-price-row > .mc-price-img:nth-child(2){ grid-column:2 !important; grid-row:1 / span 3 !important; }
  .mc-price-row > .mc-price-mobile-details{
    display:block !important;
    grid-column:3 !important;
    grid-row:1 / span 3 !important;
    min-width:0 !important;
    align-self:start !important;
  }
  .mc-price-row > .mc-price-issue,
  .mc-price-row > .mc-price-sn,
  .mc-price-row > .mc-price-money{
    display:none !important;
  }
  .mc-price-mobile-issue{
    width:100%;
    font-size:12px !important;
    font-weight:800 !important;
    line-height:1.25 !important;
    text-align:left !important;
    overflow-wrap:anywhere !important;
    margin-bottom:5px !important;
  }
  .mc-price-mobile-values{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:4px 10px !important;
    width:100% !important;
  }
  .mc-price-mobile-values > div{
    min-width:0 !important;
    text-align:left !important;
    font-size:11px !important;
    line-height:1.22 !important;
    font-weight:700 !important;
    overflow-wrap:anywhere !important;
  }
  .mc-price-mobile-values span{
    color:var(--muted) !important;
    font-weight:800 !important;
  }
}

/* === SOURCE: 096-fausto-price-guide-final-fixes.css === */
/* Final requested Price Guide fixes */
.mc-price-chart-wrap{
  width:100% !important;
  max-width:100% !important;
  overflow-x:hidden !important;
}
.mc-price-chart-wrap svg{
  width:100% !important;
  min-width:0 !important;
  height:auto !important;
  display:block !important;
}
.mc-price-avg-line{
  fill:none;
  stroke-width:2.5;
  stroke-linecap:round;
  stroke-dasharray:5 7;
  opacity:.95;
}
.mc-price-avg-line.paid{ stroke:rgba(154,139,255,.98); }
.mc-price-avg-line.estimate{ stroke:rgba(0,255,110,.92); }
.mc-price-legend i.avg-paid{
  width:18px;height:0;border-radius:0;border-top:2px dotted rgba(154,139,255,.98);background:transparent;
}
.mc-price-legend i.avg-estimate{
  width:18px;height:0;border-radius:0;border-top:2px dotted rgba(0,255,110,.92);background:transparent;
}
.mc-price-picker-trigger > span:first-child{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.mc-price-row{
  grid-template-columns:64px 64px minmax(220px,1.55fr) repeat(4, minmax(86px,.72fr)) !important;
  grid-auto-rows:auto !important;
  align-items:start !important;
}
.mc-price-head{
  grid-template-columns:64px 64px minmax(220px,1.55fr) repeat(4, minmax(86px,.72fr)) !important;
}
.mc-price-head div:nth-child(4){ display:none !important; }
.mc-price-head div:nth-child(3)::after{ content:''; }
.mc-price-sn{ display:none !important; }
.mc-price-issue{
  display:flex !important;
  flex-wrap:wrap;
  align-items:baseline;
  column-gap:10px;
  row-gap:4px;
  grid-column:3 !important;
  font-weight:800;
}
.mc-price-issue-title{ min-width:0; overflow-wrap:anywhere; }
.mc-price-sn-inline{
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}
.mc-price-issue-line,
.mc-price-mobile-issue-line{
  display:block;
  flex-basis:100%;
  height:1px;
  background:rgba(255,255,255,.16);
  margin:3px 0 2px;
}
.mc-price-social{
  grid-column:3 / -1;
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:10px;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  padding-top:2px;
}
.mc-price-social span{ color:var(--text); }
.mc-price-mobile-sn{
  color:var(--muted);
  font-size:11px;
  font-weight:800;
}
@media (max-width:780px){
  .mc-price-row{
    grid-template-columns:48px 48px minmax(0,1fr) !important;
    gap:6px 8px !important;
  }
  .mc-price-row > .mc-price-img:nth-child(1){ grid-column:1 !important; grid-row:1 / span 4 !important; }
  .mc-price-row > .mc-price-img:nth-child(2){ grid-column:2 !important; grid-row:1 / span 4 !important; }
  .mc-price-mobile-details{
    display:block !important;
    grid-column:3 !important;
    grid-row:1 / span 4 !important;
    min-width:0 !important;
  }
  .mc-price-mobile-issue{
    display:flex !important;
    flex-wrap:wrap;
    align-items:baseline;
    column-gap:8px;
    row-gap:3px;
    font-size:12px !important;
    font-weight:800 !important;
    line-height:1.25 !important;
  }
  .mc-price-mobile-issue > span:first-child{ min-width:0; overflow-wrap:anywhere; }
  .mc-price-mobile-values{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:4px 8px !important;
  }
  .mc-price-mobile-values div{
    min-width:0;
    font-size:11px !important;
    line-height:1.25 !important;
    color:var(--text);
    font-weight:700;
  }
  .mc-price-mobile-values span{
    color:var(--muted);
    font-weight:800;
  }
  .mc-price-row > .mc-price-issue,
  .mc-price-row > .mc-price-sn,
  .mc-price-row > .mc-price-money,
  .mc-price-row > .mc-price-social{
    display:none !important;
  }
}


/* Desktop Price Guide social icons: bottom-right corner only */
@media (min-width:781px){
  .mc-price-row{
    position:relative !important;
    padding-bottom:34px !important;
  }
  .mc-price-social{
    position:absolute !important;
    right:12px !important;
    bottom:8px !important;
    grid-column:auto !important;
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
    gap:14px !important;
    padding-top:0 !important;
    color:var(--muted) !important;
  }
  .mc-price-social > div{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:4px !important;
    font-size:12px !important;
    font-weight:800 !important;
    line-height:1 !important;
  }
  .mc-price-social .material-symbols-outlined{
    font-size:17px !important;
    line-height:1 !important;
  }
}

/* ===== 2026-08-17 Global Price Guide checklist layout =====
   The standalone Price Guide keeps the site's Checklist row language, but its
   visible data columns are now Comic / Issue / Sets / Avg. Price / Level plus
   a More Info action. Mobile omits Sets. */
.price-guide-filterbar{
  width:100%;
  max-width:100%;
  margin:0 0 12px;
  display:flex;
  justify-content:center;
  align-items:center;
  box-sizing:border-box;
}
.price-guide-filter-desktop{
  width:min(760px, 100%);
  max-width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
}
.price-guide-filter-desktop .archive-map-field{
  width:100%;
  max-width:100%;
  min-width:0;
  margin:0;
}
.price-guide-filter-desktop .archive-map-field-label{ text-align:left; }
.price-guide-filter-desktop .trade-page-dd,
.price-guide-filter-desktop .uniform-dd,
.price-guide-filter-desktop .archive-series-select{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}
.price-guide-mobile-filter{ display:none; }

/* Price Guide desktop: these two controls are self-explanatory; keep the row compact. */
@media (min-width:781px){
  .price-guide-filter-desktop > .archive-map-field{
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  .price-guide-filter-desktop > .archive-map-field > .archive-map-field-label{
    display:none !important;
  }
  .price-guide-filter-desktop .price-guide-cover-field{
    padding-top:0 !important;
  }
}
.price-guide-cover-field{
  width:210px !important;
  min-width:210px !important;
}
.price-guide-cover-switch-control{
  position:relative;
  min-height:42px;
  width:100%;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:6px 9px 6px 11px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  background:rgba(0,0,0,.18);
  color:var(--text);
  cursor:pointer;
  user-select:none;
}
.price-guide-cover-switch-control:hover{
  border-color:rgba(255,255,255,.18);
  background:rgba(255,255,255,.035);
}
.price-guide-cover-switch-control:focus-within{
  border-color:var(--focus);
  box-shadow:0 0 0 3px var(--focus-ring), var(--shadow);
}
.price-guide-cover-switch-text{
  min-width:0;
  font-size:13px;
  font-weight:700;
  line-height:1.2;
  white-space:nowrap;
}
.price-guide-cover-switch-input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.price-guide-cover-switch-ui{
  position:relative;
  flex:0 0 42px;
  width:42px;
  height:24px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.12);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);
  transition:background .16s ease,border-color .16s ease;
}
.price-guide-cover-switch-ui::after{
  content:'';
  position:absolute;
  top:3px;
  left:3px;
  width:16px;
  height:16px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.32);
  transition:transform .16s ease;
}
.price-guide-cover-switch-input:checked + .price-guide-cover-switch-ui{
  background:rgba(154,139,255,.34);
  border-color:rgba(154,139,255,.65);
}
.price-guide-cover-switch-input:checked + .price-guide-cover-switch-ui::after{
  transform:translateX(18px);
}

.comic-cuts-list.price-guide-checklist-list.mc-price-guide{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin-top:10px !important;
  overflow:hidden !important;
  box-sizing:border-box;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-checklist-head,
.comic-cuts-list.price-guide-checklist-list .price-guide-checklist-row{
  grid-template-columns:44px minmax(180px,2.3fr) minmax(165px,1.65fr) minmax(78px,.75fr) minmax(82px,.78fr) !important;
  gap:8px !important;
  align-items:center !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-checklist-head{
  padding-left:10px !important;
  padding-right:10px !important;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-checklist-row{
  min-height:66px !important;
  padding:6px 10px !important;
  text-decoration:none !important;
  color:inherit !important;
  cursor:pointer !important;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-cover-cell{
  width:40px !important;
  height:54px !important;
  max-width:40px !important;
  max-height:54px !important;
  overflow:hidden !important;
  border-radius:6px !important;
  background:rgba(255,255,255,.04);
  display:grid !important;
  place-items:center !important;
  justify-self:start !important;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-cover-cell img{
  width:40px !important;
  height:54px !important;
  max-width:40px !important;
  max-height:54px !important;
  object-fit:cover !important;
  display:block !important;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-cover-cell > .material-symbols-outlined{
  font-size:18px !important;
  opacity:.42;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-issue-cell{
  min-width:0 !important;
  font-size:13px !important;
  line-height:1.25 !important;
  font-weight:700 !important;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-sets-cell{
  min-width:0 !important;
  overflow:hidden !important;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-set-strip{
  width:100%;
  min-width:0;
  display:flex !important;
  align-items:center !important;
  gap:4px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  scrollbar-width:thin;
  padding:1px 0 2px;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-set-thumb{
  flex:0 0 22px !important;
  width:22px !important;
  height:30px !important;
  max-width:22px !important;
  max-height:30px !important;
  overflow:hidden !important;
  border-radius:4px !important;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  display:grid !important;
  place-items:center !important;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-set-thumb img{
  width:22px !important;
  height:30px !important;
  max-width:22px !important;
  max-height:30px !important;
  object-fit:cover !important;
  display:block !important;
}
.comic-cuts-list.price-guide-checklist-list .price-guide-money-cell,
.comic-cuts-list.price-guide-checklist-list .price-guide-level-cell{
  min-width:0 !important;
  text-align:center !important;
  justify-self:center !important;
  font-size:12px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}
.price-guide-more-info-btn{
  appearance:none;
  -webkit-appearance:none;
  justify-self:end;
  min-width:104px;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:7px 10px;
  border:1px solid var(--border);
  border-radius:10px;
  background:rgba(255,255,255,.045);
  color:var(--text);
  font:inherit;
  font-size:11px;
  font-weight:800;
  line-height:1;
  cursor:pointer;
  white-space:nowrap;
}
.price-guide-more-info-btn:hover,
.price-guide-more-info-btn:focus-visible{
  border-color:rgba(255,255,255,.38);
  background:rgba(255,255,255,.085);
}
.price-guide-more-info-btn .material-symbols-outlined{
  font-size:17px;
  line-height:1;
}
.price-guide-more-info-btn.is-loading{ opacity:.62; }
.comic-cuts-list.price-guide-checklist-list.is-guest-price-guide .price-guide-level-cell.is-guest-locked{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:var(--muted) !important;
}
.comic-cuts-list.price-guide-checklist-list.is-guest-price-guide .price-guide-level-lock{
  font-size:18px !important;
  line-height:1 !important;
  opacity:.9;
}

.price-guide-row-group{
  min-width:0;
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:0;
}
.price-guide-row-group.is-expanded > .price-guide-checklist-row{
  border-bottom-left-radius:0 !important;
  border-bottom-right-radius:0 !important;
}
.price-guide-inline-detail{
  width:100%;
  min-width:0;
  box-sizing:border-box;
  padding:12px;
  border:1px solid var(--border);
  border-top:0;
  border-radius:0 0 12px 12px;
  background:rgba(255,255,255,.022);
}
.price-guide-inline-detail[hidden]{ display:none !important; }

.price-guide-condensed-info{
  width:100%;
  min-width:0;
  display:grid;
  gap:10px;
}
.price-guide-condensed-chart.mc-price-chart-card{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  gap:8px !important;
}
.price-guide-condensed-chart .mc-price-chart-title-row,
.price-guide-condensed-chart .mc-value-signal-more{
  display:none !important;
}
/* The standalone Price Guide keeps the signal permanently expanded and
   moves metric explanations into the single More Info action below. */
.price-guide-condensed-chart .mc-value-signal-info-btn{
  display:none !important;
}
.price-guide-condensed-chart .mc-value-signal-applied-tags{
  display:flex !important;
}
.price-guide-condensed-chart .mc-value-signal-wrap{ gap:8px !important; }
.price-guide-condensed-chart .mc-value-signal-hero{
  padding:10px !important;
  gap:9px !important;
  box-shadow:none !important;
}
.price-guide-condensed-chart .mc-value-signal-kicker{ font-size:9px !important; }
.price-guide-condensed-chart .mc-value-signal-level{ font-size:18px !important; }
.price-guide-condensed-chart .mc-value-signal-score{
  min-width:62px !important;
  padding:7px 8px !important;
}
.price-guide-condensed-chart .mc-value-signal-score strong{ font-size:20px !important; }
.price-guide-condensed-chart .mc-value-signal-meter{ gap:4px !important; padding-top:13px !important; }
.price-guide-condensed-chart .mc-value-signal-segment{
  min-height:34px !important;
  padding:5px 3px !important;
  font-size:9px !important;
  pointer-events:none !important;
}
.price-guide-condensed-chart .mc-value-signal-stats{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:6px !important;
}
.price-guide-condensed-chart .mc-value-signal-stat{
  padding:8px !important;
  gap:4px !important;
}
.price-guide-condensed-chart .mc-value-signal-stat label{ font-size:8px !important; }
.price-guide-condensed-chart .mc-value-signal-stat strong{ font-size:15px !important; }
.price-guide-condensed-chart .mc-value-signal-stat-graph{ gap:5px !important; }
.price-guide-condensed-chart .mc-value-signal-stat-graph strong{ font-size:10px !important; min-width:30px !important; }
.price-guide-condensed-chart .mc-value-signal-stat-graph .mc-value-signal-track{ height:6px !important; }
.price-guide-condensed-meta{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
}
.price-guide-condensed-meta > div{
  min-width:0;
  display:grid;
  gap:3px;
  padding:8px 10px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
}
.price-guide-condensed-meta span{
  color:var(--muted);
  font-size:8px;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.price-guide-condensed-meta strong{
  min-width:0;
  font-size:13px;
  overflow-wrap:anywhere;
}
.price-guide-open-tools-btn{
  width:100%;
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  text-align:center;
}
.price-guide-open-tools-btn .material-symbols-outlined{ font-size:18px; }
.price-guide-condensed-actions{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.price-guide-condensed-action-btn{
  width:100%;
  min-width:0;
}
.price-guide-condensed-actions .price-guide-owner-tools-action{
  grid-column:1 / -1;
}
.price-guide-signal-more-info{
  display:grid;
  gap:10px;
}
.price-guide-signal-more-info-card{
  margin:0;
  padding:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.035);
}
.price-guide-signal-more-info-card h4{
  margin:0 0 6px;
  color:var(--text);
  font-size:13px;
}
.price-guide-signal-more-info-card p{
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.55;
}
.price-guide-signal-more-info-overview{
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.035);
}
.price-guide-signal-more-info-current{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:5px 9px;
}
.price-guide-signal-more-info-current > span{
  width:100%;
  color:var(--muted);
  font-size:10px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.price-guide-signal-more-info-current > strong{
  color:var(--text);
  font-size:15px;
}
.price-guide-signal-more-info-current > small{
  color:var(--muted);
  font-size:11px;
}
.price-guide-signal-more-info-levels{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
}
.price-guide-signal-more-info-level{
  min-width:0;
  display:grid;
  gap:1px;
  padding:7px 5px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.025);
  text-align:center;
}
.price-guide-signal-more-info-level.is-active{
  border-color:rgba(255,255,255,.72);
  background:rgba(255,255,255,.09);
}
.price-guide-signal-more-info-level strong{
  color:var(--text);
  font-size:10px;
}
.price-guide-signal-more-info-level span,
.price-guide-signal-more-info-level small{
  color:var(--muted);
  font-size:9px;
}
.price-guide-signal-more-info-measure,
.price-guide-signal-more-info-note{
  margin:0;
  color:var(--muted);
  font-size:11px;
  line-height:1.45;
}
.price-guide-signal-more-info-measure strong,
.price-guide-signal-more-info-note strong{ color:var(--text); }
.price-guide-signal-more-info-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.price-guide-signal-more-info-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:5px;
}
.price-guide-signal-more-info-card-head h4{ margin:0; }
.price-guide-signal-more-info-card-head > strong{
  color:var(--text);
  font-size:13px;
}
.price-guide-signal-more-info-note{
  padding:8px 10px;
  border-left:2px solid var(--border);
  background:rgba(255,255,255,.02);
}

.price-guide-more-info-overlay{ z-index:100200 !important; }
.price-guide-more-info-modal{ width:min(720px,100%) !important; }
.price-guide-more-info-body{ min-width:0; width:100%; }

@media (max-width:780px){
  .price-guide-filterbar{
    padding:0 8px !important;
    margin-bottom:10px !important;
  }
  .price-guide-filter-desktop{ display:none !important; }
  .price-guide-mobile-filter{
    width:100% !important;
    min-height:44px !important;
    display:grid !important;
    grid-template-columns:auto auto minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:7px !important;
    padding:8px 10px !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:rgba(255,255,255,.04) !important;
    color:var(--text) !important;
    font:inherit !important;
    text-align:left !important;
    cursor:pointer !important;
  }
  .price-guide-mobile-filter > .material-symbols-outlined{ font-size:18px !important; }
  .price-guide-mobile-filter > strong{
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    text-align:right !important;
    font-size:11px !important;
  }
  .comic-cuts-list.price-guide-checklist-list.mc-price-guide{
    width:100% !important;
    max-width:100% !important;
    padding:0 4px 3px !important;
  }
  .comic-cuts-list.price-guide-checklist-list .price-guide-checklist-head,
  .comic-cuts-list.price-guide-checklist-list .price-guide-checklist-row{
    grid-template-columns:32px minmax(82px,1.8fr) 54px 72px !important;
    gap:3px !important;
    min-width:0 !important;
  }
  .comic-cuts-list.price-guide-checklist-list .price-guide-sets-head,
  .comic-cuts-list.price-guide-checklist-list .price-guide-sets-cell{
    display:none !important;
  }
  .comic-cuts-list.price-guide-checklist-list .price-guide-checklist-head{
    padding:0 4px 5px !important;
    font-size:7px !important;
    line-height:1.05 !important;
    letter-spacing:.025em !important;
  }
  .comic-cuts-list.price-guide-checklist-list .price-guide-checklist-head > div{
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:anywhere !important;
    text-align:center !important;
  }
  .comic-cuts-list.price-guide-checklist-list .price-guide-checklist-row{
    min-height:52px !important;
    padding:5px 4px !important;
  }
  .comic-cuts-list.price-guide-checklist-list .price-guide-cover-cell,
  .comic-cuts-list.price-guide-checklist-list .price-guide-cover-cell img{
    width:32px !important;
    height:44px !important;
    max-width:32px !important;
    max-height:44px !important;
  }
  .comic-cuts-list.price-guide-checklist-list .price-guide-issue-cell{
    font-size:9px !important;
    line-height:1.12 !important;
  }
  .comic-cuts-list.price-guide-checklist-list .price-guide-money-cell,
  .comic-cuts-list.price-guide-checklist-list .price-guide-level-cell{
    font-size:9px !important;
  }
  .price-guide-more-info-btn{
    min-width:68px !important;
    min-height:34px !important;
    gap:3px !important;
    padding:6px 4px !important;
    border-radius:9px !important;
    font-size:8px !important;
  }
  .price-guide-more-info-btn .material-symbols-outlined{ font-size:15px !important; }
  .price-guide-inline-detail{ display:none !important; }
  .price-guide-more-info-overlay.ccc-purchase-flyup-overlay{
    top:var(--ccc-mobile-popup-top,56px) !important;
    right:0 !important;
    bottom:0 !important;
    left:0 !important;
    padding:0 !important;
    align-items:flex-end !important;
    overflow:hidden !important;
  }
  .price-guide-more-info-modal.ccc-purchase-flyup-modal{
    width:100% !important;
    max-width:none !important;
    max-height:calc(100dvh - var(--ccc-mobile-popup-top,56px)) !important;
    margin:0 !important;
    padding:16px 12px calc(14px + env(safe-area-inset-bottom,0px)) !important;
    border-right:0 !important;
    border-bottom:0 !important;
    border-left:0 !important;
    border-radius:18px 18px 0 0 !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    -webkit-overflow-scrolling:touch !important;
  }
  .price-guide-more-info-modal > h3{
    margin-right:34px !important;
    font-size:15px !important;
    overflow-wrap:anywhere;
  }
  .price-guide-signal-more-info{ gap:8px !important; }
  .price-guide-signal-more-info-overview{ padding:10px !important; gap:8px !important; }
  .price-guide-signal-more-info-current > strong{ font-size:14px !important; }
  .price-guide-signal-more-info-levels{ gap:4px !important; }
  .price-guide-signal-more-info-level{ padding:6px 3px !important; }
  .price-guide-signal-more-info-level strong{ font-size:9px !important; }
  .price-guide-signal-more-info-level span,
  .price-guide-signal-more-info-level small{ font-size:8px !important; }
  .price-guide-signal-more-info-grid{ grid-template-columns:minmax(0,1fr) !important; gap:7px !important; }
  .price-guide-signal-more-info-card{ padding:9px 10px !important; }
  .price-guide-signal-more-info-card p{ font-size:11px !important; line-height:1.4 !important; }
  .price-guide-signal-more-info-measure,
  .price-guide-signal-more-info-note{ font-size:10px !important; line-height:1.4 !important; }
  /* Mobile keeps the same applied signal factors as Comic Cut Tools.
     The individual i buttons move into the single More Info flag-up. */
  .price-guide-condensed-chart .mc-value-signal-info-btn{
    display:none !important;
  }
  .price-guide-condensed-chart .mc-value-signal-applied-tags{
    display:flex !important;
  }
  /* In the mobile Price Guide flag-up, give each Value Signal component its
     own row so Market Pressure, Value Support, and Issue Strength read
     vertically instead of being compressed into the desktop three-column row. */
  .price-guide-more-info-modal .price-guide-condensed-chart .mc-value-signal-stats{
    grid-template-columns:minmax(0,1fr) !important;
  }
  .price-guide-condensed-chart .mc-value-signal-level{ font-size:15px !important; }
  .price-guide-condensed-chart .mc-value-signal-score{ min-width:52px !important; padding:6px !important; }
  .price-guide-condensed-chart .mc-value-signal-score strong{ font-size:18px !important; }
  .price-guide-condensed-chart .mc-value-signal-segment{ min-height:32px !important; font-size:7px !important; }
  .price-guide-condensed-chart .mc-value-signal-stat{ padding:6px !important; }
  .price-guide-condensed-chart .mc-value-signal-stat label{ font-size:7px !important; }
  .price-guide-condensed-chart .mc-value-signal-stat strong{ font-size:13px !important; }
  .price-guide-condensed-chart .mc-value-signal-stat-graph strong{ font-size:9px !important; min-width:27px !important; }
  .price-guide-condensed-meta > div{ padding:7px 6px !important; }
  .price-guide-condensed-meta span{ font-size:7px !important; }
  .price-guide-condensed-meta strong{ font-size:11px !important; }
  .price-guide-open-tools-btn{ font-size:11px !important; }
  .price-guide-condensed-actions{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }
  .price-guide-condensed-actions .price-guide-owner-tools-action{
    grid-column:1 / -1 !important;
  }
}
/* ===== End Global Price Guide checklist layout ===== */

/* ===== 2026-08-17 Floating Price Guide column header v2 =====
   CSS sticky cannot be used reliably here because the site's mobile page
   intentionally keeps overflow-x hidden on ancestor wrappers.  The script
   mirrors the real Checklist header into this fixed, body-level copy only
   while the original header has scrolled behind the top bar. */
.price-guide-floating-head{
  position:fixed !important;
  z-index:2990 !important; /* directly below the site's topbar (3000) */
  display:grid !important;
  margin:0 !important;
  box-sizing:border-box !important;
  background:var(--bg, #101114) !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
  box-shadow:none !important;
  opacity:0;
  visibility:hidden;
  pointer-events:none !important;
  transform:none !important;
  transition:opacity .10s ease;
}
.price-guide-floating-head.is-visible{
  opacity:1;
  visibility:visible;
}

/* The in-list header keeps its normal Checklist appearance. */
.comic-cuts-list.price-guide-checklist-list .price-guide-checklist-head{
  position:static !important;
  top:auto !important;
  z-index:auto !important;
  background:transparent !important;
  box-shadow:none !important;
}

@media (max-width:780px){
  /* The mobile Price Guide intentionally has no Sets column.  Repeat that
     rule for the body-level floating copy, which is no longer a list child. */
  .price-guide-floating-head > div:nth-child(3){
    display:none !important;
  }
  .price-guide-floating-head{
    font-size:7px !important;
    line-height:1.05 !important;
    letter-spacing:.025em !important;
  }
  .price-guide-floating-head > div{
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:anywhere !important;
    text-align:center !important;
  }
}
/* ===== End Floating Price Guide column header v2 ===== */

/* ===== 2026-08-17 NEW Price Guide: rows-only vertical scrolling =====
   Scoped to the standalone Price Guide button beside Comic Cut Archive.
   Comic Cut Tools / the original Price Guide are intentionally untouched. */
body.global-price-guide-active{
  overflow-y:hidden !important;
  overscroll-behavior-y:none !important;
}
body.global-price-guide-active #result{
  width:100% !important;
  min-height:0 !important;
  max-height:none !important;
  padding-bottom:0 !important;
  overflow:hidden !important;
}
body.global-price-guide-active #result > .global-price-guide-shell{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}
body.global-price-guide-active .global-price-guide-shell > .price-guide-filterbar{
  flex:0 0 auto !important;
}
body.global-price-guide-active .global-price-guide-shell > .comic-cuts-list.price-guide-checklist-list.mc-price-guide{
  flex:1 1 auto !important;
  min-height:0 !important;
  margin-top:0 !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}
body.global-price-guide-active .comic-cuts-list.price-guide-checklist-list .price-guide-checklist-head{
  flex:0 0 auto !important;
}
body.global-price-guide-active .price-guide-rows-scroll{
  flex:1 1 auto !important;
  min-height:0 !important;
  width:100% !important;
  max-width:100% !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  overscroll-behavior:contain !important;
  touch-action:pan-y !important;
  scrollbar-gutter:stable;
}
body.global-price-guide-active .price-guide-rows-scroll > .price-guide-row-group{
  flex:0 0 auto !important;
  min-width:0 !important;
}


@media (max-width:780px){
  body.global-price-guide-active #result{
    padding-bottom:0 !important;
    overflow:hidden !important;
  }
  body.global-price-guide-active .comic-cuts-list.price-guide-checklist-list.mc-price-guide{
    overflow:hidden !important;
    padding-bottom:0 !important;
  }
  body.global-price-guide-active .price-guide-rows-scroll{
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }
}
/* ===== End NEW Price Guide rows-only scrolling ===== */
html.global-price-guide-active{
  overflow-y:hidden !important;
  overscroll-behavior-y:none !important;
}

/* ===== 2026-08-17 NEW Price Guide rows-only scroll visual regression fix =====
   Keep the v8 rows-only viewport, while preserving the pre-v8 title alignment
   and the Checklist's normal spacing between rows on desktop and mobile. */
body.global-price-guide-active .global-price-guide-shell > :first-child{
  align-self:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
body.global-price-guide-active .price-guide-rows-scroll{
  display:grid !important;
  grid-auto-flow:row !important;
  align-content:start !important;
  gap:16px !important;
  padding-bottom:16px !important;
  box-sizing:border-box !important;
}
body.global-price-guide-active .price-guide-rows-scroll > .price-guide-row-group{
  margin:0 !important;
}
body.global-price-guide-active .price-guide-row-group > .price-guide-checklist-row{
  margin:0 !important;
}

/* ===== End NEW Price Guide rows-only scroll visual regression fix ===== */




/* ===== NEW Price Guide loading state ===== */
body.global-price-guide-active .price-guide-loading{
  flex:1 1 auto;
  min-height:220px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:28px 16px;
  box-sizing:border-box;
  color:var(--muted);
  text-align:center;
}
body.global-price-guide-active .price-guide-loading strong{
  color:var(--text);
  font-size:15px;
  font-weight:900;
}
body.global-price-guide-active .price-guide-loading > span:last-child{
  font-size:12px;
  line-height:1.35;
}
body.global-price-guide-active .price-guide-loading-icon{
  color:var(--text);
  font-size:30px;
  animation:ccc-price-guide-spin .9s linear infinite;
}
@keyframes ccc-price-guide-spin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){
  body.global-price-guide-active .price-guide-loading-icon{ animation:none; }
}
/* ===== End NEW Price Guide loading state ===== */

/* ===== NEW Price Guide row interaction: highlight only, never lift =====
   Keep the existing hover/touch highlight, but the standalone Price Guide
   rows must remain physically stationary on desktop and mobile. */
body.global-price-guide-active .price-guide-checklist-row{
  transform:none !important;
  box-shadow:none !important;
  transition:border-color .18s ease, background .18s ease !important;
}
body.global-price-guide-active .price-guide-checklist-row:hover,
body.global-price-guide-active .price-guide-checklist-row:active,
body.global-price-guide-active .price-guide-checklist-row:focus-visible{
  transform:none !important;
  box-shadow:none !important;
}
/* ===== End NEW Price Guide row interaction ===== */

/* ===== NEW Price Guide row focus: no click border =====
   The shared Checklist row style adds a 2px outline on :focus. Price Guide
   rows are mouse/touch clickable, so a desktop click was leaving that outline
   behind. Keep the row stationary and use the existing highlight instead.
   Keyboard focus remains visible through the same highlight state; actual
   controls inside the expanded details keep their own focus-visible treatment. */
body.global-price-guide-active .price-guide-checklist-row:focus,
body.global-price-guide-active .price-guide-checklist-row:focus-visible{
  outline:none !important;
  outline-offset:0 !important;
  box-shadow:none !important;
}
body.global-price-guide-active .price-guide-checklist-row.is-loading{
  opacity:.72;
  cursor:progress !important;
}
/* ===== End NEW Price Guide row focus ===== */

/* Price Guide mobile filter: make the persistent cover setting read as a
   deliberate setting card, not another Comic Book Issue option. */
.ccc-mobile-picker-option.price-guide-cover-filter-option{
  min-height:58px;
  justify-content:flex-start;
  gap:10px;
  margin:2px 0 8px;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:13px;
  background:rgba(255,255,255,.045);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  font-weight:800;
}
.ccc-mobile-picker-option.price-guide-cover-filter-option:active{
  background:rgba(255,255,255,.075);
}
.ccc-mobile-picker-option.price-guide-cover-filter-option[aria-selected="true"]{
  border-color:rgba(154,139,255,.38);
  background:rgba(154,139,255,.10);
}
.ccc-mobile-picker-option.price-guide-cover-filter-option .ccc-mobile-picker-option-icon{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex:0 0 34px;
  border-radius:10px;
  background:rgba(255,255,255,.07);
  font-size:19px;
  opacity:.95;
}
.ccc-mobile-picker-option.price-guide-cover-filter-option[aria-selected="true"] .ccc-mobile-picker-option-icon{
  background:rgba(154,139,255,.18);
}
.ccc-mobile-picker-option.price-guide-cover-filter-option .ccc-mobile-picker-option-label{
  flex:1 1 auto;
  font-size:13px;
  line-height:1.15;
}
.ccc-mobile-picker-option.price-guide-cover-filter-option .ccc-mobile-picker-option-label::after{
  content:'16-cut issues';
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:10px;
  font-weight:700;
  letter-spacing:.01em;
}
.ccc-mobile-picker-option.price-guide-cover-filter-option .ccc-mobile-picker-option-meta{
  min-width:38px;
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:var(--muted);
  text-align:center;
  font-size:10px;
  font-weight:900;
}
.ccc-mobile-picker-option.price-guide-cover-filter-option[aria-selected="true"] .ccc-mobile-picker-option-meta{
  border-color:rgba(154,139,255,.45);
  background:rgba(154,139,255,.20);
  color:var(--text);
}

/* ===== Public Price Guide: guest Avg. Price privacy =====
   Logged-out users can browse the standalone Price Guide, but the Avg. Price
   column is omitted structurally. Reflow the remaining columns instead of
   leaving a blank track. Logged-in layout is unchanged. */
.comic-cuts-list.price-guide-checklist-list.is-guest-price-guide .price-guide-checklist-head,
.comic-cuts-list.price-guide-checklist-list.is-guest-price-guide .price-guide-checklist-row{
  grid-template-columns:44px minmax(180px,2.3fr) minmax(165px,1.65fr) minmax(82px,.78fr) !important;
}
.price-guide-condensed-meta.is-guest-price-guide-meta{
  grid-template-columns:minmax(0,1fr) !important;
}
@media (max-width:780px){
  .comic-cuts-list.price-guide-checklist-list.is-guest-price-guide .price-guide-checklist-head,
  .comic-cuts-list.price-guide-checklist-list.is-guest-price-guide .price-guide-checklist-row{
    grid-template-columns:32px minmax(74px,1.8fr) 84px !important;
  }
  .comic-cuts-list.price-guide-checklist-list.is-guest-price-guide .price-guide-more-info-btn{
    min-width:80px !important;
  }
  .comic-cuts-list.price-guide-checklist-list.is-guest-price-guide .price-guide-level-lock{
    font-size:16px !important;
  }
  .comic-cuts-list.price-guide-checklist-list.is-guest-price-guide .price-guide-level-cell.is-guest-locked .sr-only{
    display:none !important;
  }
}

/* === SOURCE: 097-fausto-mobile-price-guide-overflow-stability-fix.css === */
/* Mobile-only Price Guide stability fix.
   Keep this scoped to phones so desktop grids in Browse List, For You,
   Favorites, and My Collection keep their original width/layout. */
@media (max-width:780px){
  html,
  body{
    max-width:100% !important;
    overflow-x:hidden !important;
  }
  body{
    position:relative;
  }

  .container,
  #result{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    overflow-x:hidden !important;
  }

  /* Scope overflow fixes to the Price Guide only. */
  .mc-price-guide,
  .mc-price-guide *,
  .mc-price-chart-card,
  .mc-price-chart-wrap,
  .mc-price-list,
  .mc-price-head,
  .mc-price-row{
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  .mc-price-chart-card,
  .mc-price-chart-wrap,
  .mc-price-list{
    overflow:hidden !important;
  }

  .mc-price-chart-wrap{
    width:100% !important;
    touch-action:pan-y !important;
  }

  .mc-price-chart-wrap svg{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  .mc-price-head,
  .mc-price-row{
    width:100% !important;
  }

  .mc-price-picker-panel.open{
    max-width:calc(100vw - 24px) !important;
  }

  /* Keep the tab strip stable on mobile without changing desktop grids. */
  .mc-tabs{
    max-width:100% !important;
    overscroll-behavior-x:contain !important;
    scroll-padding-left:4px !important;
    scroll-padding-right:4px !important;
  }
}

/* === SOURCE: 098-fausto-tab-underline-only-fix.css === */
.mc-tabs .mc-tab.active,
.mc-tabs .mc-tab[aria-pressed="true"]{
  background:transparent !important;
  border-color:transparent !important;
  border-bottom-color:#ffffff !important;
  box-shadow:none !important;
  color:var(--text) !important;
}
@media (hover: hover) and (pointer: fine){
.mc-tabs .mc-tab:hover{
  background:transparent !important;
  border-bottom-color:#ffffff !important;
}
}
@media (max-width:780px){
  .mc-tabs .mc-tab.active,
  .mc-tabs .mc-tab[aria-pressed="true"]{
    background:transparent !important;
    border-color:transparent !important;
    border-bottom-color:#ffffff !important;
    box-shadow:none !important;
    color:var(--text) !important;
  }
}

/* === SOURCE: 099-fausto-price-guide-mobile-contained-dropdown-fix-v2.css === */
@media (max-width:560px){
  .mc-price-guide-picker-mount,
  .mc-price-guide-picker-mount .mc-price-picker-row,
  .mc-price-picker-row{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    overflow:visible !important;
  }

  .mc-price-guide-picker-mount .mc-price-picker,
  .mc-price-picker{
    position:relative !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:visible !important;
  }

  .mc-price-picker-trigger{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  .mc-price-picker-trigger > span:first-child{
    display:block !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  /* Keep the dropdown inside the picker instead of centering/fixing it to the viewport. */
  .mc-price-guide-picker-mount .mc-price-picker-panel.open,
  .mc-price-picker-panel.open{
    position:absolute !important;
    top:calc(100% + 8px) !important;
    left:0 !important;
    right:0 !important;
    transform:none !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
    z-index:5000 !important;
    max-height:min(340px,52vh) !important;
    overflow:auto !important;
  }

  @supports (height:100dvh){
    .mc-price-guide-picker-mount .mc-price-picker-panel.open,
    .mc-price-picker-panel.open{
      max-height:min(340px,52dvh) !important;
    }
  }
}

@media (max-width:780px){
  /* Contain only Price Guide content; do not clip the whole page after selection. */
  .mc-price-guide,
  .mc-price-chart-card,
  .mc-price-list,
  .mc-price-row,
  .mc-price-head,
  .mc-price-mobile-details,
  .mc-price-mobile-values,
  .mc-price-mobile-values div,
  .mc-price-mobile-issue,
  .mc-price-mobile-issue > span,
  .mc-price-issue,
  .mc-price-issue-title,
  .mc-price-money{
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    overflow-wrap:anywhere !important;
  }

  .mc-price-chart-card,
  .mc-price-guide,
  .mc-price-list{
    width:100% !important;
    max-width:100% !important;
  }

  .mc-price-chart-wrap{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:visible !important;
  }

  .mc-price-chart-wrap svg{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    display:block !important;
  }
}

/* === SOURCE: 100-fausto-price-guide-mobile-no-horizontal-overflow-v3.css === */
@media (max-width:780px){
  html,
  body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  body.price-guide-active .container,
  body.price-guide-active #result,
  body.price-guide-active .mc-profile-wrap,
  body.price-guide-active .mc-profile-card,
  body.price-guide-active .mc-tabs,
  body.price-guide-active .mc-toolbar,
  body.price-guide-active .mc-price-guide,
  body.price-guide-active .mc-price-chart-card,
  body.price-guide-active .mc-price-list,
  body.price-guide-active .mc-price-row{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  body.price-guide-active .mc-tabs{
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
  }

  /* Price Guide mobile toolbar: filter button + picker only. */
  body.price-guide-active .mc-toolbar{
    display:grid !important;
    grid-template-columns:44px minmax(0,1fr) !important;
    align-items:start !important;
    justify-content:stretch !important;
    gap:8px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    overflow:visible !important;
  }

  body.price-guide-active #mcFiltersMount{
    grid-column:1 !important;
    min-width:0 !important;
  }

  body.price-guide-active .mc-filters-toggle{
    width:44px !important;
    max-width:44px !important;
  }

  body.price-guide-active #mcPriceGuidePickerMount,
  body.price-guide-active .mc-price-guide-picker-mount{
    grid-column:2 !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    display:block !important;
    overflow:visible !important;
  }

  /* These controls are disabled on Price Guide anyway; hiding them prevents the row from pushing off-screen. */
  body.price-guide-active .mc-toolbar-actions{
    display:none !important;
  }

  body.price-guide-active .mc-price-picker-row{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    gap:8px !important;
    overflow:visible !important;
  }

  body.price-guide-active .mc-price-picker{
    flex:1 1 auto !important;
    width:auto !important;
    max-width:100% !important;
    min-width:0 !important;
    position:relative !important;
    overflow:visible !important;
  }

  body.price-guide-active .mc-price-deselect-btn{
    flex:0 0 44px !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
  }

  body.price-guide-active .mc-price-picker-trigger{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  body.price-guide-active .mc-price-picker-trigger > span:first-child{
    display:block !important;
    min-width:0 !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
  }

  body.price-guide-active .mc-price-picker-panel.open{
    position:absolute !important;
    top:calc(100% + 8px) !important;
    left:0 !important;
    right:0 !important;
    transform:none !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:0 !important;
    box-sizing:border-box !important;
    z-index:6000 !important;
    max-height:min(340px,52vh) !important;
    overflow:auto !important;
  }

  @supports (height:100dvh){
    body.price-guide-active .mc-price-picker-panel.open{
      max-height:min(340px,52dvh) !important;
    }
  }

  body.price-guide-active .mc-price-picker-option,
  body.price-guide-active .mc-price-picker-option span,
  body.price-guide-active .mc-price-picker-search,
  body.price-guide-active .mc-price-mobile-details,
  body.price-guide-active .mc-price-mobile-values,
  body.price-guide-active .mc-price-mobile-values div,
  body.price-guide-active .mc-price-mobile-issue,
  body.price-guide-active .mc-price-mobile-issue span,
  body.price-guide-active .mc-price-chart-title{
    min-width:0 !important;
    max-width:100% !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
  }

  body.price-guide-active .mc-price-chart-card,
  body.price-guide-active .mc-price-guide,
  body.price-guide-active .mc-price-list{
    overflow:hidden !important;
  }

  body.price-guide-active .mc-price-chart-wrap{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
  }

  body.price-guide-active .mc-price-chart-wrap svg{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    display:block !important;
  }
}

/* === SOURCE: 101-fausto-price-guide-hide-toolbar-controls.css === */
/* Price Guide only: remove Filter, View, and Sort controls while keeping the issue picker visible. */
body.price-guide-active #mcFiltersMount,
body.price-guide-active .mc-toolbar-actions,
body.price-guide-active .mc-view-toggle-wrap,
body.price-guide-active .mc-sort-wrap{
  display:none !important;
}

body.price-guide-active .mc-toolbar{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
}

body.price-guide-active #mcPriceGuidePickerMount,
body.price-guide-active .mc-price-guide-picker-mount{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
}

body.price-guide-active .mc-price-picker-row{
  width:100% !important;
  max-width:100% !important;
}

@media (max-width:780px){
  body.price-guide-active .mc-toolbar{
    display:block !important;
    grid-template-columns:none !important;
    gap:0 !important;
  }

  body.price-guide-active #mcPriceGuidePickerMount,
  body.price-guide-active .mc-price-guide-picker-mount{
    grid-column:1 / -1 !important;
  }
}

/* === SOURCE: 102-fausto-price-guide-inline-edit-fix.css === */
.mc-price-edit-btn.is-active,
.mc-price-edit-btn.is-active:hover:not(:disabled){
  border-color:rgba(154,139,255,.70) !important;
  background:rgba(154,139,255,.22) !important;
  color:#fff !important;
}
.mc-price-edit-input{
  width:100%;
  min-width:0;
  height:34px;
  padding:7px 8px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.28);
  color:var(--text);
  font:inherit;
  font-size:13px;
  font-weight:800;
  outline:none;
  box-sizing:border-box;
}
.mc-price-edit-input:focus{
  border-color:rgba(255,255,255,.72);
  box-shadow:0 0 0 3px rgba(154,139,255,.22);
  background:rgba(0,0,0,.36);
}
.mc-price-row.is-editing{ cursor:default !important; }
.mc-price-row.is-editing:hover{ transform:none !important; }
.mc-price-row.is-editing .mc-price-edit-cell{ padding:0 !important; }
@media (max-width:780px){
  body.price-guide-edit-active .mc-price-mobile-values{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:6px 8px !important;
  }
  body.price-guide-edit-active .mc-price-mobile-avg-paid,
  body.price-guide-edit-active .mc-price-mobile-avg-est,
  body.price-guide-edit-active .mc-price-mobile-favs,
  body.price-guide-edit-active .mc-price-mobile-bookmarks{
    display:none !important;
  }
  body.price-guide-edit-active .mc-price-mobile-values > div{ display:block !important; }
  body.price-guide-edit-active .mc-price-edit-input{
    height:38px !important;
    font-size:16px !important;
    padding:8px 9px !important;
  }
  body.price-guide-edit-active .mc-price-row{ cursor:default !important; }
}

/* === SOURCE: 103-my-collection-mobile-overlay-lite-glass-v3.css === */
/* Lightweight replacement for the removed mobile overlay blur.
   Uses static tint, gradient, border, and shadow instead of backdrop-filter,
   so it keeps the glass/dimmed look without forcing mobile browsers to blur
   the image underneath on every scroll/repaint. */
@media (max-width:780px){
  #result .mc-profile-wrap ~ .mini-results .mc-issue-overlay,
  #result .mc-profile-wrap ~ .mini-results .mini-popover{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    background:
      radial-gradient(circle at 50% 16%, rgba(154,139,255,.20) 0%, rgba(154,139,255,.08) 35%, rgba(154,139,255,0) 62%),
      linear-gradient(180deg, rgba(18,14,34,.74) 0%, rgba(4,4,8,.68) 100%) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.10),
      inset 0 18px 42px rgba(255,255,255,.045),
      inset 0 -34px 54px rgba(0,0,0,.36) !important;
  }

  #result .mc-profile-wrap ~ .mini-results .mini-popover-card,
  #result .mc-profile-wrap ~ .mini-results .mc-issue-overlay-panel{
    background:
      linear-gradient(180deg, rgba(28,24,48,.94) 0%, rgba(7,7,12,.88) 100%) !important;
    border-color:rgba(255,255,255,.22) !important;
    box-shadow:
      0 14px 30px rgba(0,0,0,.46),
      inset 0 1px 0 rgba(255,255,255,.12),
      0 0 0 1px rgba(154,139,255,.10) !important;
  }

  #result .mc-profile-wrap ~ .mini-results .mini-popover-cardnum,
  #result .mc-profile-wrap ~ .mini-results .mini-popover-serial,
  #result .mc-profile-wrap ~ .mini-results .mc-issue-overlay-title,
  #result .mc-profile-wrap ~ .mini-results .mc-issue-overlay-count{
    text-shadow:
      0 2px 8px rgba(0,0,0,.88),
      0 0 12px rgba(154,139,255,.20) !important;
  }

  #result .mc-profile-wrap ~ .mini-results .mini-popover-divider,
  #result .mc-profile-wrap ~ .mini-results .mc-issue-overlay-divider{
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.40), transparent) !important;
  }

  #result .mc-profile-wrap ~ .mini-results .mini-popover-view,
  #result .mc-profile-wrap ~ .mini-results .mc-issue-overlay-btn{
    background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.07)) !important;
    border-color:rgba(255,255,255,.24) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.10),
      0 8px 18px rgba(0,0,0,.24) !important;
  }

  #result .mc-profile-wrap ~ .mini-results .mini-popover-view:active,
  #result .mc-profile-wrap ~ .mini-results .mc-issue-overlay-btn:active{
    background:rgba(255,255,255,.16) !important;
  }
}

/* === SOURCE: 104-mobile-filter-sort-layer-fix.css === */
/* Mobile-only fix: keep My Collection filter/sort panels above the card grid.
   The toolbar is transformed on mobile, which creates its own stacking context;
   without an explicit z-index, later grid items can paint over the opened panels. */
@media (max-width:780px){
  .mc-toolbar{
    position:relative !important;
    z-index:95 !important;
    overflow:visible !important;
    isolation:isolate !important;
  }

  #mcFiltersMount,
  .mc-filters,
  .mc-filters-inner,
  .mc-toolbar-actions,
  .mc-sort-wrap{
    position:relative !important;
    z-index:96 !important;
    overflow:visible !important;
  }

  .mc-filters-panel,
  .mc-sort-menu{
    z-index:98 !important;
  }
}

/* === SOURCE: 105-mobile-collection-toolbar-unblock-fix.css === */
/* Mobile-only correction for My Collection -> comic cuts grid view.
   The previous header redraw fix accidentally put the toolbar in a painted
   containment/composited layer. That can clip the tops of the Filter / Switch
   / Sort buttons and also clip/block their dropdown panels. Keep the header
   repaint fix, but explicitly leave the toolbar and its menus uncontained,
   overflow-visible, and above the progressive image grid. */
@media (max-width:780px){
  body.mc-mobile-collection-flat-active #result > .mc-toolbar{
    contain: none !important;
    overflow: visible !important;
    position: relative !important;
    z-index: 260 !important;
    isolation: isolate !important;
    transform: none !important;
    -webkit-transform: none !important;
    padding-top: 0 !important; /* corrected: was 3px and made toolbar sit lower */
  }

  body.mc-mobile-collection-flat-active #result > .mc-toolbar *,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-toolbar-actions,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar #mcFiltersMount,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-sort-wrap{
    overflow: visible !important;
    pointer-events: auto !important;
  }

  body.mc-mobile-collection-flat-active #result > .mc-toolbar #mcFiltersMount,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-toolbar-actions,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-sort-wrap{
    position: relative !important;
    z-index: 270 !important;
  }

  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-filters-panel,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-sort-menu{
    contain: none !important;
    overflow: visible !important;
    z-index: 5000 !important;
    pointer-events: auto !important;
  }

  body.mc-mobile-collection-flat-active #result > .mini-results{
    z-index: 1 !important;
  }
}

/* === SOURCE: 106-mobile-collection-toolbar-final-alignment-confirmed.css === */
/* CONFIRMED FINAL OVERRIDE: Mobile My Collection -> comic cuts grid only.
   Keeps filter/sort unblocked and contained, but removes the leftover vertical
   offset so Filter / Switch to Grouped / Sort match Favorites placement. */
@media (max-width:780px){
  body.mc-mobile-collection-flat-active #result > .mc-toolbar{
    padding-top:0 !important;
    margin-top:2px !important;
    align-items:center !important;
  }
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-toolbar-actions,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar #mcFiltersMount,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-sort-wrap,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-view-toggle-wrap{
    align-items:center !important;
  }
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-filters-toggle,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-view-toggle-btn,
  body.mc-mobile-collection-flat-active #result > .mc-toolbar .mc-sort-icon-btn{
    margin-top:0 !important;
    top:auto !important;
    transform:none !important;
  }
}

/* === SOURCE: 107-for-you-mobile-header-and-switch-fix.css === */
/* Mobile-only For You fix.
   Scoped to My Collection -> For You only: keep the header/toolbar paintable
   while the image grid scrolls fast, and grey out the unavailable Switch button.
   No sticky/fixed positioning, no margin/top changes. */
@media (max-width:780px){
  body.mc-mobile-for-you-active #result > .mc-profile-wrap,
  body.mc-mobile-for-you-active #result > .mc-mode-label,
  body.mc-mobile-for-you-active #result > .mc-tabs,
  body.mc-mobile-for-you-active #result > .mc-toolbar{
    position: relative !important;
    z-index: 120 !important;
    isolation: isolate !important;
    transform: translateZ(0) !important;
    -webkit-transform: translateZ(0) !important;
    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
  }

  body.mc-mobile-for-you-active #result > .mc-profile-wrap .mc-profile-card,
  body.mc-mobile-for-you-active #result > .mc-profile-wrap .mc-profile-row,
  body.mc-mobile-for-you-active #result > .mc-profile-wrap .mc-profile-expand{
    transform: translateZ(0) !important;
    -webkit-transform: translateZ(0) !important;
    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
    will-change: opacity !important;
  }

  body.mc-mobile-for-you-active #result > .mc-profile-wrap .mc-profile-card{
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(255,255,255,.085) !important;
  }

  body.mc-mobile-for-you-active.mc-grid-scroll-active #result > .mc-profile-wrap .mc-profile-card,
  body.mc-mobile-for-you-active.mc-grid-scroll-active #result > .mc-tabs{
    opacity:.999 !important;
    outline:1px solid rgba(255,255,255,.001) !important;
  }

  body.mc-mobile-for-you-active #result > .for-you-wrap,
  body.mc-mobile-for-you-active #result > .for-you-grid-wrap,
  body.mc-mobile-for-you-active #result .for-you-grid{
    position: relative !important;
    z-index: 1 !important;
    contain: layout style !important;
  }

  body.mc-mobile-for-you-active #result > .mc-toolbar .mc-view-toggle-btn:disabled,
  body.mc-mobile-for-you-active #result > .mc-toolbar .mc-view-toggle-btn.is-disabled{
    opacity:.42 !important;
    cursor:not-allowed !important;
    pointer-events:none !important;
    border-color:rgba(255,255,255,.08) !important;
    background:rgba(255,255,255,.025) !important;
    color:var(--muted) !important;
    box-shadow:none !important;
  }
}

/* === SOURCE: 108-comic-archive-mobile-dropdown-clip-fix.css === */
/* Mobile-only Comic Cut Archive dropdown fix.
   Keep this scoped to the Archive set selector only. The dropdown list was
   being painted in the normal archive flow, so on phones it could be clipped
   or covered by the rows below it. Do not touch My Collection, Favorites,
   For You, filters, sort, or grid behavior. */
@media (max-width:780px){
  #result > .archive-series-row{
    position:relative !important;
    z-index:1800 !important;
    overflow:visible !important;
    isolation:isolate !important;
  }

  #result > .archive-series-row .uniform-dd{
    position:relative !important;
    z-index:1801 !important;
    overflow:visible !important;
  }

  #result > .archive-series-row .uniform-dd.open{
    z-index:2200 !important;
  }

  #result > .archive-series-row .uniform-dd.open .uniform-dd-list{
    display:block !important;
    position:absolute !important;
    top:calc(100% + 6px) !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    max-height:min(260px, 46dvh) !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    z-index:9999 !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior:contain !important;
    touch-action:pan-y !important;
  }

  #result > .archive-series-row .uniform-dd-option{
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }
}

/* === SOURCE: 109-archive-mobile-dropdown-fixed-panel-confirmed.css === */
@media (max-width:780px){
  body.ccc-archive-dd-open #result > .archive-series-row{
    overflow:visible !important;
    z-index:3000 !important;
  }

  body.ccc-archive-dd-open #result > .archive-series-row .uniform-dd.open .uniform-dd-list{
    position:fixed !important;
    top:var(--ccc-archive-dd-top, 140px) !important;
    left:var(--ccc-archive-dd-left, 12px) !important;
    right:auto !important;
    width:var(--ccc-archive-dd-width, calc(100vw - 24px)) !important;
    max-width:calc(100vw - 24px) !important;
    max-height:calc(100dvh - var(--ccc-archive-dd-top, 140px) - 14px) !important;
    box-sizing:border-box !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    z-index:12000 !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior:contain !important;
    touch-action:pan-y !important;
  }

  body.ccc-archive-dd-open #result > .archive-series-row .uniform-dd.open .uniform-dd-option{
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }
}

/* === SOURCE: 110-archive-mobile-dropdown-open-up-fixed.css === */
@media (max-width:780px){
  body.ccc-archive-dd-open #result > .archive-series-row{
    position:relative !important;
    z-index:5000 !important;
    overflow:visible !important;
  }

  body.ccc-archive-dd-open #result > .archive-series-row .uniform-dd.open{
    position:relative !important;
    z-index:5001 !important;
    overflow:visible !important;
  }

  body.ccc-archive-dd-open #result > .archive-series-row .uniform-dd.open .uniform-dd-list{
    display:block !important;
    position:fixed !important;
    top:var(--ccc-archive-dd-top, 140px) !important;
    left:var(--ccc-archive-dd-left, 12px) !important;
    right:auto !important;
    width:var(--ccc-archive-dd-width, calc(100vw - 24px)) !important;
    max-width:calc(100vw - 24px) !important;
    max-height:var(--ccc-archive-dd-max-height, 280px) !important;
    box-sizing:border-box !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    z-index:30000 !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior:contain !important;
    touch-action:pan-y !important;
  }

  body.ccc-archive-dd-open #result > .archive-series-row .uniform-dd.open .uniform-dd-option{
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    min-height:44px !important;
  }
}

/* === SOURCE: 111-archive-mobile-dropdown-body-portal-final.css === */
@media (max-width:780px){
  body.ccc-archive-portal-open{
    overflow-x:hidden !important;
  }

  body.ccc-archive-portal-open #result > .archive-series-row .uniform-dd.open .uniform-dd-list{
    display:none !important;
  }

  .ccc-archive-dd-portal{
    position:fixed !important;
    left:var(--ccc-archive-portal-left, 12px) !important;
    top:var(--ccc-archive-portal-top, 120px) !important;
    width:var(--ccc-archive-portal-width, calc(100vw - 24px)) !important;
    max-width:calc(100vw - 24px) !important;
    max-height:var(--ccc-archive-portal-max-height, 420px) !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior:contain !important;
    touch-action:pan-y !important;
    z-index:2147483000 !important;
    box-sizing:border-box !important;
    border:1px solid var(--border) !important;
    border-radius:12px !important;
    background:linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%) !important;
    box-shadow:0 18px 48px rgba(0,0,0,.62) !important;
  }

  .ccc-archive-dd-portal-option{
    width:100% !important;
    display:block !important;
    box-sizing:border-box !important;
    padding:12px 14px !important;
    min-height:46px !important;
    border:0 !important;
    border-bottom:1px solid rgba(255,255,255,.07) !important;
    background:transparent !important;
    color:var(--text) !important;
    text-align:left !important;
    font:inherit !important;
    font-size:16px !important;
    line-height:1.25 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    cursor:pointer !important;
  }

  .ccc-archive-dd-portal-option:last-child{
    border-bottom:0 !important;
  }

  .ccc-archive-dd-portal-option[aria-selected="true"]{
    background:rgba(154,139,255,.20) !important;
  }
}

/* === SOURCE: 112-fausto-mobile-my-collection-tabs-centering-fix.css === */
/* Mobile My Collection navigation now contains five text tabs.
   Keep them in one row and restore the original horizontal swipe/scroll behavior
   instead of squeezing or wrapping the labels. */
@media (max-width:780px){
  #result > .mc-tabs,
  .mc-tabs{
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: clamp(14px, 5vw, 24px) !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    scroll-snap-type: x proximity !important;
    overscroll-behavior-x: contain !important;
    box-sizing: border-box !important;
  }

  #result > .mc-tabs::-webkit-scrollbar,
  .mc-tabs::-webkit-scrollbar{
    display: none !important;
  }

  #result > .mc-tabs .mc-tab,
  .mc-tabs .mc-tab{
    flex: 0 0 auto !important;
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: nowrap !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    scroll-snap-align: start !important;
  }
}

/* === SOURCE: 113-desktop-pill-dropdown-disable-white-thumb-accent.css === */
/* Desktop only: keep the pill display, but disable opening the custom dropdowns. */
@media (min-width: 781px){
  .card .pillgrid .pill.has-dd,
  .card .pillgrid .custom-dd-wrapper,
  .card .pillgrid .custom-dd-trigger{
    cursor: default !important;
  }

  .card .pillgrid .custom-dd-trigger{
    pointer-events: none !important;
  }

  .card .pillgrid .custom-dd-list,
  .card .pillgrid .custom-dd-list.open{
    display: none !important;
  }
}

/* === SOURCE: 114-thumbnail-window-css-clean-final.css === */
/* ===== Thumbnail window: cleaned, non-overlapping final styles =====
   Purpose: make the alternate-thumbnail window match the Additional Information
   quiet glass panel while preventing old hover/mobile rules from fighting it. */
.card .altthumbs-wrap{
  margin-top:8px !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  max-height:210px !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
  touch-action:pan-y !important;
  box-sizing:border-box !important;
  padding:6px 8px !important;

  border:1px solid rgba(255,255,255,.085) !important;
  border-radius:12px !important;
  background:linear-gradient(180deg, rgba(255,255,255,.024), rgba(255,255,255,.010)) !important;
  box-shadow:none !important;
  transition:none !important;
}

.card .altthumbs-wrap:hover,
.card .altthumbs-wrap:active,
.card .altthumbs-wrap:focus,
.card .altthumbs-wrap:focus-within{
  border-color:rgba(255,255,255,.085) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.024), rgba(255,255,255,.010)) !important;
  box-shadow:none !important;
  outline:none !important;
}

.card .altthumbs{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:6px !important;
  width:100% !important;
  min-width:0 !important;
}

.card .altthumb{
  appearance:none !important;
  -webkit-appearance:none !important;
  display:block !important;
  min-width:0 !important;
  padding:2px !important;
  cursor:pointer !important;
  border:1px solid rgba(255,255,255,.075) !important;
  border-radius:8px !important;
  background:rgba(255,255,255,.012) !important;
  box-shadow:none !important;
  transition:border-color .12s ease, background .12s ease !important;
}

.card .altthumb:hover,
.card .altthumb:focus-visible{
  border-color:#ffffff !important;
  background:rgba(255,255,255,.035) !important;
  box-shadow:none !important;
  outline:none !important;
}

.card .altthumb:active,
.card .altthumb:focus{
  border-color:rgba(255,255,255,.075) !important;
  background:rgba(255,255,255,.012) !important;
  box-shadow:none !important;
  outline:none !important;
  transform:none !important;
}

.card .altthumb img{
  width:100% !important;
  aspect-ratio:3 / 4 !important;
  height:auto !important;
  object-fit:cover !important;
  display:block !important;
  border-radius:6px !important;
  background:rgba(255,255,255,.025) !important;
  -webkit-user-drag:none !important;
}

/* The thumbnail currently shown in the main view turns black and white. */
.card .altthumb.is-main-view-selected img{
  filter:grayscale(1) saturate(0) !important;
}

.card .altthumbs .alt-divider,
.card .altthumbs .alt-owner-divider .line,
.card .alt-owner-rule{
  background:rgba(255,255,255,.075) !important;
}

.card .altthumbs .alt-owner-divider{
  grid-column:1 / -1 !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  width:100% !important;
  min-width:0 !important;
  margin:8px 0 6px !important;
  opacity:.9 !important;
}

.card .altthumbs .alt-owner-divider .lbl,
.card .alt-owner-label{
  color:rgba(168,172,179,.88) !important;
  font-size:10px !important;
  font-weight:800 !important;
  letter-spacing:.08em !important;
  line-height:1.25 !important;
  text-transform:uppercase !important;
  text-shadow:none !important;
}

/* Selected cut: white border only, no layout changes. */
.card .altthumb.is-main-view-selected,
.card .altthumb.is-main-view-selected:hover,
.card .altthumb.is-main-view-selected:active,
.card .altthumb.is-main-view-selected:focus,
.card .altthumb.is-main-view-selected:focus-visible{
  border-color:#ffffff !important;
}

@media (max-width:780px){
  .card .altthumbs-wrap{
    padding:4px !important;
    border-color:rgba(255,255,255,.075) !important;
    background:rgba(255,255,255,.012) !important;
    transition:none !important;
  }

  /* Mobile only: keep the same 3-column thumbnail grid, just reduce spacing slightly. */
  .card .altthumbs{
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    gap:3px !important;
  }

  .card .altthumb,
  .card .altthumb:hover,
  .card .altthumb:active,
  .card .altthumb:focus,
  .card .altthumb:focus-visible{
    border-color:rgba(255,255,255,.075) !important;
    background:rgba(255,255,255,.012) !important;
    box-shadow:none !important;
    outline:none !important;
    transform:none !important;
    transition:none !important;
    padding:1px !important;
  }

  .card .altthumb.is-main-view-selected,
  .card .altthumb.is-main-view-selected:hover,
  .card .altthumb.is-main-view-selected:active,
  .card .altthumb.is-main-view-selected:focus,
  .card .altthumb.is-main-view-selected:focus-visible{
    border-color:#ffffff !important;
  }
}

/* === SOURCE: 115-owner-pill-total-cuts-white-fix.css === */
/* Owner pill: keep the normal pill look at rest, but make the whole pill clickable. */
.card .pillgrid .pill.owner-pill{
  cursor: pointer !important;
}
.card .pillgrid .pill.owner-pill > *{
  pointer-events: none;
}

/* Hover/focus only: restore the subtle highlight behavior instead of a permanent purple fill. */
.card .pillgrid .pill.owner-pill:hover,
.card .pillgrid .pill.owner-pill:focus-visible{
  border-color: rgba(255,255,255,.60) !important;
  background: rgba(255,255,255,.08) !important;
}

/* Keep Total comic cuts title/icon gold, but make the number/value white. */
.card .cc-highlight-total-comic-cuts-for-issue .cc-highlight-value{
  color: rgba(242,243,255,.96) !important;
}

/* === SOURCE: 116-field-group-color-system-final.css === */
:root{
  --ccg-comic-cut-info: rgba(154,139,255,.90);
  --ccg-comic-cut-info-soft: rgba(154,139,255,.095);
  --ccg-specific-trading-card: rgba(255,214,120,.90);
  --ccg-specific-trading-card-soft: rgba(255,214,120,.082);
  --ccg-set-card-details: rgba(95,238,218,.84);
  --ccg-set-card-details-soft: rgba(95,238,218,.072);
  --ccg-comic-book-details: rgba(80,220,125,.88);
  --ccg-comic-book-details-soft: rgba(80,220,125,.072);
  --ccg-private-information: rgba(255,146,95,.86);
  --ccg-private-information-soft: rgba(255,146,95,.070);
  --ccg-image-details: rgba(120,170,255,.88);
  --ccg-image-details-soft: rgba(120,170,255,.074);
  --ccg-personal-information: rgba(210,203,255,.88);
  --ccg-personal-information-soft: rgba(210,203,255,.074);
}

/* Field-group colors follow the same Edit Card sections. */
.card .pill.ccg-comic-cut-info,
.card .more .kv.ccg-comic-cut-info,
.card .cc-highlight-row.ccg-comic-cut-info{ --ccg-accent: var(--ccg-comic-cut-info); --ccg-soft: var(--ccg-comic-cut-info-soft); }
.card .pill.ccg-specific-trading-card,
.card .more .kv.ccg-specific-trading-card,
.card .cc-highlight-row.ccg-specific-trading-card{ --ccg-accent: var(--ccg-specific-trading-card); --ccg-soft: var(--ccg-specific-trading-card-soft); }
.card .pill.ccg-set-card-details,
.card .more .kv.ccg-set-card-details,
.card .cc-highlight-row.ccg-set-card-details{ --ccg-accent: var(--ccg-set-card-details); --ccg-soft: var(--ccg-set-card-details-soft); }
.card .pill.ccg-comic-book-details,
.card .more .kv.ccg-comic-book-details,
.card .cc-highlight-row.ccg-comic-book-details{ --ccg-accent: var(--ccg-comic-book-details); --ccg-soft: var(--ccg-comic-book-details-soft); }

/* Error is the one Comic Book Details highlight with its own coral accent.
   Keep the normal group-first color system for every other highlight. */
.card .cc-highlight-row.cc-highlight-error-comic-cut{
  --ccg-accent:#FF5C6C !important;
  --ccg-soft:rgba(255,92,108,.10) !important;
}
.card .pill.ccg-private-information,
.card .more .kv.ccg-private-information,
.card .cc-highlight-row.ccg-private-information{ --ccg-accent: var(--ccg-private-information); --ccg-soft: var(--ccg-private-information-soft); }
.card .pill.ccg-image-details,
.card .more .kv.ccg-image-details,
.card .cc-highlight-row.ccg-image-details{ --ccg-accent: var(--ccg-image-details); --ccg-soft: var(--ccg-image-details-soft); }
.card .pill.ccg-personal-information,
.card .more .kv.ccg-personal-information,
.card .cc-highlight-row.ccg-personal-information{ --ccg-accent: var(--ccg-personal-information); --ccg-soft: var(--ccg-personal-information-soft); }

.card .pill.ccg-comic-cut-info,
.card .pill.ccg-specific-trading-card,
.card .pill.ccg-set-card-details,
.card .pill.ccg-comic-book-details,
.card .pill.ccg-private-information,
.card .pill.ccg-image-details,
.card .pill.ccg-personal-information{
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.016)),
    radial-gradient(220px 84px at 0% 0%, var(--ccg-soft, rgba(154,139,255,.075)), transparent 72%) !important;
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--ccg-accent, rgba(154,139,255,.9)) 42%, transparent) !important;
}
.card .pill.ccg-comic-cut-info label,
.card .pill.ccg-specific-trading-card label,
.card .pill.ccg-set-card-details label,
.card .pill.ccg-comic-book-details label,
.card .pill.ccg-private-information label,
.card .pill.ccg-image-details label,
.card .pill.ccg-personal-information label{
  color: color-mix(in srgb, var(--ccg-accent, rgba(154,139,255,.9)) 78%, rgba(255,255,255,.72)) !important;
}

/* Additional Information rows: color the label only, keep values readable. */
.card .more .kv.ccg-comic-cut-info .k,
.card .more .kv.ccg-specific-trading-card .k,
.card .more .kv.ccg-set-card-details .k,
.card .more .kv.ccg-comic-book-details .k,
.card .more .kv.ccg-private-information .k,
.card .more .kv.ccg-image-details .k,
.card .more .kv.ccg-personal-information .k{
  color: color-mix(in srgb, var(--ccg-accent, rgba(154,139,255,.9)) 76%, rgba(255,255,255,.68)) !important;
}
.card .more .kv .v{
  color: rgba(242,243,255,.96) !important;
}

/* Value Highlights: icon/title use the field-group color; results stay white. */
.card .cc-highlight-row.ccg-comic-cut-info .cc-highlight-icon,
.card .cc-highlight-row.ccg-comic-cut-info .cc-highlight-label,
.card .cc-highlight-row.ccg-specific-trading-card .cc-highlight-icon,
.card .cc-highlight-row.ccg-specific-trading-card .cc-highlight-label,
.card .cc-highlight-row.ccg-set-card-details .cc-highlight-icon,
.card .cc-highlight-row.ccg-set-card-details .cc-highlight-label,
.card .cc-highlight-row.ccg-comic-book-details .cc-highlight-icon,
.card .cc-highlight-row.ccg-comic-book-details .cc-highlight-label,
.card .cc-highlight-row.ccg-private-information .cc-highlight-icon,
.card .cc-highlight-row.ccg-private-information .cc-highlight-label,
.card .cc-highlight-row.ccg-image-details .cc-highlight-icon,
.card .cc-highlight-row.ccg-image-details .cc-highlight-label,
.card .cc-highlight-row.ccg-personal-information .cc-highlight-icon,
.card .cc-highlight-row.ccg-personal-information .cc-highlight-label{
  color: var(--ccg-accent, rgba(154,139,255,.84)) !important;
}
.card .cc-highlight-row .cc-highlight-value,
.card .cc-highlight-age-of-book-series .cc-highlight-value,
.card .cc-highlight-total-comic-cuts-for-issue .cc-highlight-value{
  color: rgba(242,243,255,.96) !important;
}

/* Keep owner pill hover-only highlight behavior intact. */
.card .pillgrid .pill.owner-pill{
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.016)),
    radial-gradient(220px 84px at 0% 0%, var(--ccg-soft, rgba(154,139,255,.075)), transparent 72%) !important;
}
.card .pillgrid .pill.owner-pill:hover,
.card .pillgrid .pill.owner-pill:focus-visible{
  border-color: rgba(255,255,255,.60) !important;
  background: rgba(255,255,255,.08) !important;
}

/* === SOURCE: 117-six-main-pills-white-accents.css === */
/* Make the main comic-cut metadata pills neutral/white for logged-in and logged-out views. */
.card .pillgrid .pill,
.card .pillgrid .pill.ccg-comic-cut-info,
.card .pillgrid .pill.ccg-specific-trading-card,
.card .pillgrid .pill.ccg-set-card-details,
.card .pillgrid .pill.ccg-comic-book-details,
.card .pillgrid .pill.ccg-private-information,
.card .pillgrid .pill.ccg-image-details,
.card .pillgrid .pill.ccg-personal-information,
.card .pillgrid .pill.owner-pill{
  border-color: rgba(255,255,255,.105) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.016)),
    radial-gradient(220px 84px at 0% 0%, rgba(255,255,255,.055), transparent 72%) !important;
  box-shadow: inset 3px 0 0 rgba(255,255,255,.24) !important;
}
.card .pillgrid .pill label,
.card .pillgrid .pill.ccg-comic-cut-info label,
.card .pillgrid .pill.ccg-specific-trading-card label,
.card .pillgrid .pill.ccg-set-card-details label,
.card .pillgrid .pill.ccg-comic-book-details label,
.card .pillgrid .pill.ccg-private-information label,
.card .pillgrid .pill.ccg-image-details label,
.card .pillgrid .pill.ccg-personal-information label,
.card .pillgrid .pill.owner-pill label{
  color: rgba(255,255,255,.78) !important;
}
.card .pillgrid .pill strong,
.card .pillgrid .pill .v,
.card .pillgrid .pill select,
.card .pillgrid .custom-dd-trigger{
  color: rgba(246,247,255,.96) !important;
}
.card .pillgrid .pill.pill-link:hover,
.card .pillgrid .pill.owner-pill:hover,
.card .pillgrid .pill.owner-pill:focus-visible{
  border-color: rgba(255,255,255,.60) !important;
  background: rgba(255,255,255,.08) !important;
  box-shadow: inset 3px 0 0 rgba(255,255,255,.34) !important;
}

/* === SOURCE: 118-owner-pill-my-collection-icon-right-align.css === */
.card .pillgrid .pill.owner-pill{
  position: relative !important;
  padding-right: 38px !important;
}
.card .pillgrid .pill.owner-pill .owner-pill-mc-icon{
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 20px;
  line-height: 1;
  color: rgba(246,247,255,.96);
  opacity: .92;
  pointer-events: none;
}
.card .pillgrid .pill.owner-pill:hover .owner-pill-mc-icon,
.card .pillgrid .pill.owner-pill:focus-visible .owner-pill-mc-icon{
  opacity: 1;
}

/* === SOURCE: 119-owner-field-label-one-size-smaller.css === */
.card .pillgrid .pill.owner-pill label{
  font-size: 10px !important;
}

/* === SOURCE: 120-owner-pill-conditional-long-name-size.css === */
.card .pillgrid .pill.owner-pill.owner-pill-long-name > div:not(.custom-dd-wrapper){
  font-size: 12px !important;
  line-height: 1.18 !important;
}
@media (max-width: 820px), (hover: none) and (pointer: coarse){
  .card .pillgrid .pill.owner-pill.owner-pill-long-name > div:not(.custom-dd-wrapper){
    font-size: 12.5px !important;
    line-height: 1.34 !important;
  }
}

/* === SOURCE: 121-issue-specialist-award-gold-visible-fix.css === */
/* This uses the row-specific variable used by the current Value Highlights theme,
   and also directly targets the icon/title so later generic purple rules cannot win. */
.card .cc-highlight-row.cc-highlight-issue-specialist-award{
  --cc-highlight-accent: rgba(255, 214, 90, .98) !important;
  --ccg-accent: rgba(255, 214, 90, .98) !important;
  --ccc-card-accent: rgba(255, 214, 90, .98) !important;
  --ccg-soft: rgba(255, 214, 90, .10) !important;
}
.card .cc-highlight-row.cc-highlight-issue-specialist-award > .cc-highlight-icon,
.card .cc-highlight-row.cc-highlight-issue-specialist-award > .cc-highlight-icon .material-symbols-outlined,
.card .cc-highlight-row.cc-highlight-issue-specialist-award .cc-highlight-label{
  color: rgba(255, 214, 90, .98) !important;
}
.card .cc-highlight-row.cc-highlight-issue-specialist-award .cc-highlight-value{
  color: rgba(242,243,255,.96) !important;
}
.card .cc-highlight-row.cc-highlight-issue-specialist-award .cc-highlight-note{
  color: rgba(181,185,198,.88) !important;
}

/* === SOURCE: 122-ccc-global-mobile-scroll-stability-fix.css === */
/*
  Mobile-only scroll stability patch.
  Goal: keep the browser viewport as the one vertical scroller across Home,
  Set View, My Collection, Price Guide, For You, and other generated views.
  This prevents mobile WebKit/Chrome from pausing near the top/bottom until
  the user reverses direction, which can happen when nested sections use
  contain/content-visibility, overscroll containment, transforms, or clipped
  wrappers during fast image-heavy scrolling.
*/

html.ccc-body-scroll-locked,
body.ccc-body-scroll-locked{
  overflow:hidden !important;
  overscroll-behavior:none !important;
}
body.ccc-body-scroll-locked{
  touch-action:auto !important;
}

@media (max-width: 780px){
  html{
    height:auto !important;
    min-height:100% !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior-y:auto !important;
    scroll-behavior:auto !important;
    -webkit-text-size-adjust:100%;
  }

  body:not(.ccc-body-scroll-locked){
    height:auto !important;
    min-height:100vh !important;
    min-height:100svh !important;
    min-height:100dvh !important;
    max-width:100% !important;
    overflow-x:hidden !important;
    overflow-y:visible !important;
    overscroll-behavior-y:auto !important;
    touch-action:pan-y !important;
    position:relative !important;
  }

  /* Keep page-level wrappers from becoming accidental vertical scroll traps. */
  body:not(.ccc-body-scroll-locked) .container,
  body:not(.ccc-body-scroll-locked) #result,
  body:not(.ccc-body-scroll-locked) .result,
  body:not(.ccc-body-scroll-locked) .for-you-wrap,
  body:not(.ccc-body-scroll-locked) .for-you-grid-wrap,
  body:not(.ccc-body-scroll-locked) .comic-cuts-list,
  body:not(.ccc-body-scroll-locked) .mini-results,
  body:not(.ccc-body-scroll-locked) .mc-price-guide,
  body:not(.ccc-body-scroll-locked) .mc-price-list{
    height:auto !important;
    max-height:none !important;
    overflow-y:visible !important;
    overscroll-behavior-y:auto !important;
    content-visibility:visible !important;
    contain:none !important;
    transform:none !important;
    will-change:auto !important;
  }

  /* Keep horizontal scrollers horizontal, but allow vertical page scroll chaining. */
  body:not(.ccc-body-scroll-locked) .mc-tabs,
  body:not(.ccc-body-scroll-locked) .mc-price-chart-wrap,
  body:not(.ccc-body-scroll-locked) .mc-value-signal-applied-tags,
  body:not(.ccc-body-scroll-locked) .mc-gallery-viewport,
  body:not(.ccc-body-scroll-locked) .mc-filters-row{
    overscroll-behavior-y:auto !important;
    touch-action:pan-x pan-y !important;
    -webkit-overflow-scrolling:touch !important;
  }

  /* Modal/flyout/dropdown internals should still scroll inside themselves. */
  .flyout .content,
  .modal .modal-body,
  .protip-popup-body,
  .ac,
  .modal-dd-list,
  .uniform-dd-list,
  .mc-sort-menu,
  .mc-filters-panel,
  .mc-price-picker-panel{
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior:contain !important;
  }

  /* A little end-of-document breathing room avoids the last gesture dying at the edge. */
  #ccc-mobile-scroll-sentinel{
    display:block !important;
    height:calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    pointer-events:none !important;
  }
}

/* === SOURCE: 123-ccc-mobile-bottom-gap-tighten-fix.css === */
@media (max-width: 780px){
  body:not(.ccc-body-scroll-locked) #result,
  body:not(.ccc-body-scroll-locked) .result{
    padding-bottom: 8px !important;
  }

  body:not(.ccc-body-scroll-locked) .container{
    padding-bottom: 8px !important;
  }

  #ccc-mobile-scroll-sentinel{
    height: calc(8px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* === SOURCE: 124-pill-boxes-match-additional-info-style.css === */
/* Match the main pill boxes to the quiet Additional Information panel:
   neutral glass panel, soft divider feel, no colored side accents. */
.card .pillgrid .pill,
.card .pillgrid .pill.ccg-comic-cut-info,
.card .pillgrid .pill.ccg-specific-trading-card,
.card .pillgrid .pill.ccg-set-card-details,
.card .pillgrid .pill.ccg-comic-book-details,
.card .pillgrid .pill.ccg-private-information,
.card .pillgrid .pill.ccg-image-details,
.card .pillgrid .pill.ccg-personal-information,
.card .pillgrid .pill.owner-pill{
  border:1px solid rgba(154,139,255,.15) !important;
  border-radius:12px !important;
  background:
    linear-gradient(180deg, rgba(154,139,255,.044), rgba(255,255,255,.012) 42%, rgba(255,255,255,.008)),
    radial-gradient(520px 160px at 0% -10%, rgba(154,139,255,.075), transparent 68%) !important;
  box-shadow:var(--cc-panel-glow, 0 18px 42px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035)) !important;
  padding:10px 12px !important;
  gap:4px !important;
  min-height:44px !important;
}

.card .pillgrid .pill label,
.card .pillgrid .pill.ccg-comic-cut-info label,
.card .pillgrid .pill.ccg-specific-trading-card label,
.card .pillgrid .pill.ccg-set-card-details label,
.card .pillgrid .pill.ccg-comic-book-details label,
.card .pillgrid .pill.ccg-private-information label,
.card .pillgrid .pill.ccg-image-details label,
.card .pillgrid .pill.ccg-personal-information label,
.card .pillgrid .pill.owner-pill label{
  color:rgba(201,196,255,.78) !important;
  font-size:10px !important;
  font-weight:820 !important;
  letter-spacing:.075em !important;
  line-height:1.35 !important;
  text-transform:uppercase !important;
}

.card .pillgrid .pill > div:not(.custom-dd-wrapper),
.card .pillgrid .pill strong,
.card .pillgrid .pill .v,
.card .pillgrid .pill select,
.card .pillgrid .custom-dd-trigger{
  color:rgba(242,243,255,.96) !important;
  font-size:13.5px !important;
  font-weight:650 !important;
  line-height:1.42 !important;
}

/* Keep clickable pills understated, like the Additional Information panel. */
.card .pillgrid .pill.pill-link:hover,
.card .pillgrid .pill.pill-link:active,
.card .pillgrid .pill.owner-pill:hover,
.card .pillgrid .pill.owner-pill:active,
.card .pillgrid .pill.owner-pill:focus-visible,
.card .pillgrid .pill.has-dd:hover,
.card .pillgrid .pill.has-dd:active{
  border-color:rgba(154,139,255,.15) !important;
  background:
    linear-gradient(180deg, rgba(154,139,255,.044), rgba(255,255,255,.012) 42%, rgba(255,255,255,.008)),
    radial-gradient(520px 160px at 0% -10%, rgba(154,139,255,.075), transparent 68%) !important;
  box-shadow:var(--cc-panel-glow, 0 18px 42px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035)) !important;
}

/* Preserve the Owner icon spacing, but let the Owner box share the same visual style. */
.card .pillgrid .pill.owner-pill{
  padding-right:38px !important;
}
.card .pillgrid .pill.owner-pill .owner-pill-mc-icon{
  color:rgba(242,243,255,.92) !important;
}

@media (max-width: 820px), (hover: none) and (pointer: coarse){
  .card .pillgrid .pill,
  .card .pillgrid .pill.ccg-comic-cut-info,
  .card .pillgrid .pill.ccg-specific-trading-card,
  .card .pillgrid .pill.ccg-set-card-details,
  .card .pillgrid .pill.ccg-comic-book-details,
  .card .pillgrid .pill.ccg-private-information,
  .card .pillgrid .pill.ccg-image-details,
  .card .pillgrid .pill.ccg-personal-information,
  .card .pillgrid .pill.owner-pill{
    /* Mobile main-card pill palette: match the neutral Checklist action treatment
       while keeping the existing pill shape, sizing, spacing, and placement. */
    border-color:rgba(255,255,255,.16) !important;
    background:rgba(255,255,255,.075) !important;
    box-shadow:none !important;
  }

  /* Mobile summary headers are always the same muted grey, regardless of
     field group, link state, owner state, or logged-in status. */
  html body #result .card .pillgrid > .pill > label{
    color:var(--muted) !important;
    font-size:8.5px !important;
    font-weight:800 !important;
    line-height:1.2 !important;
  }

  html body #result .card .pillgrid > .pill > div:not(.custom-dd-wrapper),
  html body #result .card .pillgrid > .pill strong,
  html body #result .card .pillgrid > .pill .v,
  html body #result .card .pillgrid > .pill select,
  html body #result .card .pillgrid .custom-dd-trigger{
    color:#ffffff !important;
    font-size:12.5px !important;
    line-height:1.34 !important;
    font-weight:640 !important;
  }

  .card .pillgrid .pill.pill-link:hover,
  .card .pillgrid .pill.pill-link:active,
  .card .pillgrid .pill.owner-pill:hover,
  .card .pillgrid .pill.owner-pill:active,
  .card .pillgrid .pill.owner-pill:focus-visible,
  .card .pillgrid .pill.has-dd:hover,
  .card .pillgrid .pill.has-dd:active,
  .card .pillgrid .pill.set-pill-checklist:hover,
  .card .pillgrid .pill.set-pill-checklist:active,
  .card .pillgrid .pill.set-pill-checklist:focus-visible,
  .card .pillgrid .pill.issue-pill-checklist:hover,
  .card .pillgrid .pill.issue-pill-checklist:active,
  .card .pillgrid .pill.issue-pill-checklist:focus-visible{
    border-color:rgba(255,255,255,.50) !important;
    background:rgba(255,255,255,.12) !important;
  }
}

/* Mobile Full Detail summary sizing: the three visible pills keep a fixed
   footprint aligned from the top of the main image through the bottom of the
   under-image Value Highlight. Text shrinks in JavaScript when a long value
   needs more room, so card-to-card navigation does not resize this top row. */
@media (max-width: 780px){
  #result .card:not(.ccc-mobile-lite-card) .pillgrid.ccc-mobile-fixed-summary-pills{
    box-sizing:border-box !important;
    height:var(--ccc-mobile-summary-height) !important;
    min-height:0 !important;
    grid-template-columns:1fr !important;
    grid-template-rows:repeat(var(--ccc-mobile-summary-pill-count, 3), minmax(0, 1fr)) !important;
    align-self:start !important;
  }

  #result .card:not(.ccc-mobile-lite-card) .pillgrid.ccc-mobile-fixed-summary-pills > .pill:not(.mobile-card-number-pill){
    box-sizing:border-box !important;
    height:100% !important;
    min-height:0 !important;
    max-height:none !important;
    /* The summary pill is always exactly two content rows: label + value.
       Any remaining pill height stays below those rows instead of being placed
       between them. This keeps Serial Number, Set, Issue, and Owner on the same
       vertical rhythm even when their DOM/value type differs. */
    align-content:start !important;
    grid-template-rows:max-content max-content !important;
    row-gap:4px !important;
  }

  #result .card:not(.ccc-mobile-lite-card) .pillgrid.ccc-mobile-fixed-summary-pills > .pill > label{
    align-self:start !important;
    margin:0 !important;
    line-height:1.2 !important;
  }

  #result .card:not(.ccc-mobile-lite-card) .pillgrid.ccc-mobile-fixed-summary-pills > .pill > div:not(.custom-dd-wrapper),
  #result .card:not(.ccc-mobile-lite-card) .pillgrid.ccc-mobile-fixed-summary-pills .custom-dd-trigger{
    min-width:0 !important;
    max-width:100% !important;
    align-self:start !important;
    margin:0 !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
    line-height:1.16 !important;
    white-space:normal !important;
    overflow:hidden !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
  }

  /* Serial Number (and any other summary field) can be either a plain value or
     a custom dropdown depending on how many choices exist. Those two render
     paths must occupy the same value row; centering the wrapper caused the
     label-to-value gap to change from card to card. */
  #result .card:not(.ccc-mobile-lite-card) .pillgrid.ccc-mobile-fixed-summary-pills .custom-dd-wrapper{
    min-width:0 !important;
    max-width:100% !important;
    width:100% !important;
    align-self:start !important;
    margin:0 !important;
  }


  /* One-line mobile summary values align to the exact vertical center of their
     right-side icon. JavaScript computes the small shift from the rendered
     geometry, so wrapped two-line values keep their existing top-aligned flow. */
  #result .card:not(.ccc-mobile-lite-card) .pillgrid.ccc-mobile-fixed-summary-pills > .pill.ccc-summary-pill-single-line > div:not(.custom-dd-wrapper),
  #result .card:not(.ccc-mobile-lite-card) .pillgrid.ccc-mobile-fixed-summary-pills > .pill.ccc-summary-pill-single-line .custom-dd-trigger{
    transform:translateY(var(--ccc-summary-single-line-shift, 0px)) !important;
  }
}

/* === SOURCE: 125-owner-pill-desktop-white-hover-border.css === */
@media (hover: hover) and (pointer: fine){
  .card .pillgrid .pill.owner-pill:hover{
    border-color: #ffffff !important;
  }
}

/* === SOURCE: 126-owner-thumbnail-window-one-tenth-size-fix.css === */
/* Only affects the separate owner thumbnail window. The Master Database thumbnail
   window keeps its existing size and grid. */
.card .altthumbs-wrap.altthumbs-wrap--owners .altthumbs{
  grid-template-columns:repeat(auto-fill, minmax(18px, 18px)) !important;
  justify-content:start !important;
  align-items:start !important;
  gap:2px !important;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .altthumb,
.card .altthumbs-wrap.altthumbs-wrap--owners .altthumb:hover,
.card .altthumbs-wrap.altthumbs-wrap--owners .altthumb:active,
.card .altthumbs-wrap.altthumbs-wrap--owners .altthumb:focus,
.card .altthumbs-wrap.altthumbs-wrap--owners .altthumb:focus-visible{
  width:18px !important;
  min-width:18px !important;
  max-width:18px !important;
  height:24px !important;
  min-height:24px !important;
  max-height:24px !important;
  padding:1px !important;
  border-radius:3px !important;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .altthumb img{
  width:100% !important;
  height:100% !important;
  aspect-ratio:3 / 4 !important;
  object-fit:cover !important;
  border-radius:2px !important;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-divider{
  grid-column:1 / -1 !important;
  margin:6px 0 4px !important;
}
@media (max-width:780px){
  .card .altthumbs-wrap.altthumbs-wrap--owners .altthumbs{
    grid-template-columns:repeat(auto-fill, minmax(10px, 10px)) !important;
    gap:2px !important;
  }
  .card .altthumbs-wrap.altthumbs-wrap--owners .altthumb,
  .card .altthumbs-wrap.altthumbs-wrap--owners .altthumb:hover,
  .card .altthumbs-wrap.altthumbs-wrap--owners .altthumb:active,
  .card .altthumbs-wrap.altthumbs-wrap--owners .altthumb:focus,
  .card .altthumbs-wrap.altthumbs-wrap--owners .altthumb:focus-visible{
    width:10px !important;
    min-width:10px !important;
    max-width:10px !important;
    height:14px !important;
    min-height:14px !important;
    max-height:14px !important;
    padding:1px !important;
    border-radius:2px !important;
  }
}

/* === SOURCE: 127-mobile-lite-hide-pre-gallery-nav-counters.css === */
@media (max-width:780px), (hover:none) and (pointer:coarse){
  body.ccc-mobile-lite-pre-gallery #comicCutNav,
  body.ccc-mobile-lite-pre-gallery #comicCutNavCounters{
    display:none !important;
    visibility:hidden !important;
  }
}

/* === SOURCE: 128-safe-logged-out-desktop-panels-30-taller.css === */
@media (min-width:781px){
  body:not(.ccc-auth-logged-in) .card .details-panels .more,
  body:not(.ccc-auth-logged-in) .card .cc-highlights-panel{
    max-height:429px !important;
  }
}

/* === SOURCE: 129-ccc-set-pill-white-hover.css === */
/* Desktop-only legacy hover treatment. Mobile Set and Comic Book Issue
   pill interaction colors are owned by 124-pill-boxes-match-additional-info-style.css. */
@media (min-width:821px) and (hover:hover) and (pointer:fine){
  .card .pillgrid .pill.set-pill-checklist:hover,
  .card .pillgrid .pill.set-pill-checklist:active,
  .card .pillgrid .pill.set-pill-checklist:focus-visible,
  .card .pillgrid .pill.issue-pill-checklist:hover,
  .card .pillgrid .pill.issue-pill-checklist:active,
  .card .pillgrid .pill.issue-pill-checklist:focus-visible{
    border-color:#ffffff !important;
  }
}

/* === SOURCE: 130-owner-thumbnail-accordion-cards-patch.css === */
.card .altthumbs-wrap.altthumbs-wrap--owners{
  max-height:300px !important;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .altthumbs{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:7px !important;
  align-items:stretch !important;
  justify-content:stretch !important;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card{
  grid-column:1 / -1 !important;
  width:100% !important;
  appearance:none;
  -webkit-appearance:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:40px;
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(255,255,255,.04);
  color:var(--text);
  cursor:pointer;
  text-align:left;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card:hover,
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card:focus-visible,
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card.is-open{
  border-color:rgba(255,255,255,.6);
  background:rgba(255,255,255,.08);
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card:active{
  transform:translateY(1px);
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card-main{
  min-width:0;
  display:grid;
  gap:2px;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card-label{
  min-width:0;
  color:var(--owner-name-color, rgba(210,203,255,.94));
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-shadow:0 0 18px color-mix(in srgb, var(--owner-name-color, rgba(210,203,255,.94)) 24%, transparent);
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card-count{
  color:var(--muted);
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card-icon{
  flex:0 0 auto;
  font-size:18px;
  color:var(--owner-name-color, rgba(210,203,255,.94));
  transition:transform .18s ease;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card[aria-expanded="true"] .alt-owner-card-icon{
  transform:rotate(180deg);
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel{
  grid-column:1 / -1 !important;
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(27px, 27px)) !important;
  justify-content:start !important;
  align-items:start !important;
  gap:4px !important;
  padding:7px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:rgba(0,0,0,.13);
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel[hidden]{
  display:none !important;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb,
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:hover,
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:active,
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:focus,
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:focus-visible{
  width:27px !important;
  min-width:27px !important;
  max-width:27px !important;
  height:36px !important;
  min-height:36px !important;
  max-height:36px !important;
  padding:1px !important;
  border-radius:4px !important;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb img{
  width:100% !important;
  height:100% !important;
  aspect-ratio:3 / 4 !important;
  object-fit:cover !important;
  border-radius:3px !important;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-divider{
  display:none !important;
}
@media (max-width:780px){
  .card .altthumbs-wrap.altthumbs-wrap--owners{
    max-height:260px !important;
  }
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel{
    grid-template-columns:repeat(auto-fill, minmax(15px, 15px)) !important;
    gap:3px !important;
    padding:6px;
  }
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb,
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:hover,
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:active,
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:focus,
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:focus-visible{
    width:15px !important;
    min-width:15px !important;
    max-width:15px !important;
    height:21px !important;
    min-height:21px !important;
    max-height:21px !important;
    border-radius:3px !important;
  }
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card{
    min-height:38px;
    padding:7px 9px;
  }
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-card-label{ font-size:11px; }
}

/* === SOURCE: 131-owner-thumbnail-window-much-bigger-final.css === */
/* Only targets the owner thumbnail window (all owners except Master Database).
   Master Database thumbnails keep their existing sizing. */
.card .altthumbs-wrap.altthumbs-wrap--owners{
  max-height:420px !important;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel{
  grid-template-columns:repeat(auto-fill, minmax(72px, 72px)) !important;
  gap:8px !important;
  padding:10px !important;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb,
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:hover,
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:active,
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:focus,
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:focus-visible{
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  height:96px !important;
  min-height:96px !important;
  max-height:96px !important;
  padding:2px !important;
  border-radius:7px !important;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb img{
  width:100% !important;
  height:100% !important;
  aspect-ratio:3 / 4 !important;
  object-fit:contain !important;
  border-radius:5px !important;
}
@media (max-width:780px){
  .card .altthumbs-wrap.altthumbs-wrap--owners{
    max-height:360px !important;
  }
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel{
    grid-template-columns:repeat(auto-fill, minmax(54px, 54px)) !important;
    gap:7px !important;
    padding:8px !important;
  }
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb,
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:hover,
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:active,
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:focus,
  .card .altthumbs-wrap.altthumbs-wrap--owners .alt-owner-thumb-panel .altthumb:focus-visible{
    width:54px !important;
    min-width:54px !important;
    max-width:54px !important;
    height:72px !important;
    min-height:72px !important;
    max-height:72px !important;
    padding:2px !important;
    border-radius:6px !important;
  }
}

/* === SOURCE: 132-owner-thumbnail-fixed-height-collapsed-start-patch.css === */
/* Keep the owner thumbnail window the same size whether owner boxes are open or closed. */
.card .altthumbs-wrap.altthumbs-wrap--owners{
  height:420px !important;
  max-height:420px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain;
}
.card .altthumbs-wrap.altthumbs-wrap--owners .altthumbs{
  align-content:start !important;
}
@media (max-width:780px){
  .card .altthumbs-wrap.altthumbs-wrap--owners{
    height:360px !important;
    max-height:360px !important;
  }
}

/* === SOURCE: 133-owner-thumbnail-auto-height-final.css === */
/* The previous patch fixed the owner thumbnail area at 420px/360px,
   which made the window too tall when only a few owner rows were shown.
   This lets it shrink to the content, while still scrolling if it gets long. */
.card .altthumbs-wrap.altthumbs-wrap--owners{
  height:auto !important;
  min-height:0 !important;
  max-height:min(420px, 70dvh) !important;
}

@media (max-width:780px){
  .card .altthumbs-wrap.altthumbs-wrap--owners{
    height:auto !important;
    min-height:0 !important;
    max-height:min(360px, 60dvh) !important;
  }
}

/* === SOURCE: 134-desktop-owner-horizontal-scroll-final.css === */
@media (min-width:781px){
  .card .card-main > .altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll{
    order:-1 !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 0 12px 0 !important;
    padding:0 !important;
    display:grid !important;
    grid-template-columns:34px minmax(0, 1fr) 34px !important;
    gap:8px !important;
    align-items:center !important;
    overflow:hidden !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:rgba(255,255,255,.04) !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-viewport{
    min-width:0 !important;
    width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    touch-action:pan-x !important;
    scrollbar-width:thin;
    padding:8px 0 !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .altthumbs{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    grid-template-columns:none !important;
    grid-auto-flow:column !important;
    gap:8px !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    width:max-content !important;
    min-width:max-content !important;
    max-width:none !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .altthumb,
  .card .altthumbs-wrap--owners-desktop-scroll .altthumb:hover,
  .card .altthumbs-wrap--owners-desktop-scroll .altthumb:active,
  .card .altthumbs-wrap--owners-desktop-scroll .altthumb:focus,
  .card .altthumbs-wrap--owners-desktop-scroll .altthumb:focus-visible,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:hover,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:active,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:focus,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:focus-visible{
    flex:0 0 72px !important;
    width:72px !important;
    min-width:72px !important;
    max-width:72px !important;
    height:96px !important;
    min-height:96px !important;
    max-height:96px !important;
    padding:2px !important;
    border-radius:7px !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .altthumb img,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb img{
    width:100% !important;
    height:100% !important;
    aspect-ratio:3 / 4 !important;
    object-fit:contain !important;
    border-radius:5px !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-separator{
    flex:0 0 1px !important;
    align-self:stretch !important;
    width:1px !important;
    min-width:1px !important;
    height:auto !important;
    margin:4px 4px !important;
    background:linear-gradient(to bottom, transparent, rgba(255,255,255,.22), transparent) !important;
    border-radius:999px !important;
    pointer-events:none !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-card,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-card-label,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-card-count,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-card-icon,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-divider,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-label,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-rule{
    display:none !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-btn{
    appearance:none !important;
    -webkit-appearance:none !important;
    width:34px !important;
    min-width:34px !important;
    height:100% !important;
    min-height:112px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:0 !important;
    background:rgba(255,255,255,.025) !important;
    color:rgba(255,255,255,.82) !important;
    cursor:pointer !important;
    padding:0 !important;
    transition:background .18s ease, color .18s ease, opacity .18s ease !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-btn:hover,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-btn:focus-visible{
    background:rgba(255,255,255,.08) !important;
    color:#ffffff !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-btn:disabled{
    opacity:.28 !important;
    cursor:default !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-btn .material-symbols-outlined{
    font-size:24px !important;
    line-height:1 !important;
  }
}

/* === SOURCE: 135-desktop-owner-horizontal-images-70-larger.css === */
@media (min-width:781px){
  /* Restore the horizontal thumbnail cards/window to the prior compact size. */
  .card .altthumbs-wrap--owners-desktop-scroll .altthumb,
  .card .altthumbs-wrap--owners-desktop-scroll .altthumb:hover,
  .card .altthumbs-wrap--owners-desktop-scroll .altthumb:active,
  .card .altthumbs-wrap--owners-desktop-scroll .altthumb:focus,
  .card .altthumbs-wrap--owners-desktop-scroll .altthumb:focus-visible,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:hover,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:active,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:focus,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:focus-visible{
    flex:0 0 72px !important;
    width:72px !important;
    min-width:72px !important;
    max-width:72px !important;
    height:96px !important;
    min-height:96px !important;
    max-height:96px !important;
    overflow:hidden !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-btn{
    min-height:112px !important;
  }

  /* Enlarge only the image inside each thumbnail by 70%. */
  .card .altthumbs-wrap--owners-desktop-scroll .altthumb img,
  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb img{
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    object-fit:cover !important;
    transform:scale(1.7) !important;
    transform-origin:center center !important;
  }
}

/* === SOURCE: 136-owner-selectable-thumbnails-actual-70-larger-final.css === */
@media (min-width:781px){
  /* The earlier patch zoomed the img inside a 72x96 button, so the selectable
     thumbnails still looked tiny. This increases the actual clickable thumbnail
     item size from 72x96 to about 122x163 while keeping the horizontal strip layout. */
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-viewport{
    padding:10px 0 !important;
  }

  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumbs{
    gap:10px !important;
  }

  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb:hover,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb:active,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb:focus,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb:focus-visible,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:hover,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:active,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:focus,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:focus-visible{
    flex:0 0 122px !important;
    width:122px !important;
    min-width:122px !important;
    max-width:122px !important;
    height:163px !important;
    min-height:163px !important;
    max-height:163px !important;
    padding:3px !important;
    border-radius:8px !important;
    overflow:hidden !important;
  }

  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb img,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb img{
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    aspect-ratio:3 / 4 !important;
    object-fit:contain !important;
    transform:none !important;
    border-radius:5px !important;
  }

  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-separator{
    margin:6px 6px !important;
    background:linear-gradient(to bottom, transparent, rgba(255,255,255,.24), transparent) !important;
  }

  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-btn{
    min-height:183px !important;
  }
}

/* === SOURCE: 137-owner-selectable-thumbnails-40-smaller-final.css === */
@media (min-width:781px){
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-viewport{
    padding:8px 0 !important;
  }

  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumbs{
    gap:8px !important;
  }

  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb:hover,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb:active,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb:focus,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb:focus-visible,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:hover,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:active,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:focus,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb:focus-visible{
    flex:0 0 73px !important;
    width:73px !important;
    min-width:73px !important;
    max-width:73px !important;
    height:98px !important;
    min-height:98px !important;
    max-height:98px !important;
    padding:2px !important;
    border-radius:7px !important;
    overflow:hidden !important;
  }

  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .altthumb img,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-thumb-panel .altthumb img{
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    aspect-ratio:3 / 4 !important;
    object-fit:contain !important;
    transform:none !important;
    border-radius:5px !important;
  }

  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-separator{
    margin:4px 4px !important;
    background:linear-gradient(to bottom, transparent, rgba(255,255,255,.24), transparent) !important;
  }

  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-btn{
    min-height:114px !important;
  }
}

/* === SOURCE: 138-owner-thumbnail-no-arrows-no-reset-final.css === */
@media (min-width:781px){
  .card .card-main > .altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll,
  .card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll{
    grid-template-columns:minmax(0, 1fr) !important;
    gap:0 !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-btn{
    display:none !important;
  }

  .card .altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-viewport{
    padding:8px !important;
  }
}

/* === SOURCE: 139-ccc-logged-out-arrow-height-match-checklist.css === */
body:not(.ccc-auth-logged-in) .card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav.is-visible #backToSetBtn,
body:not(.ccc-auth-logged-in) .card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav.is-visible #nextComicCutBtn{
  height:40px !important;
  min-height:40px !important;
  max-height:40px !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  box-sizing:border-box !important;
}

@media (max-width:780px){
  body:not(.ccc-auth-logged-in) .card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav.is-visible #backToSetBtn,
  body:not(.ccc-auth-logged-in) .card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav.is-visible #nextComicCutBtn{
    height:38px !important;
    min-height:38px !important;
    max-height:38px !important;
  }
}

/* === SOURCE: 140-thumbnail-owner-value-border-final-override.css === */
/* Main/master thumbnail window */
.card .thumb,
.card .altthumbs-wrap,
.card .altthumbs-wrap--master,
.card .altthumbs-wrap.altthumbs-wrap--master{
  border:0 !important;
  border-color:transparent !important;
  outline:0 !important;
  box-shadow:none !important;
}

/* Owner thumbnail window, including the desktop horizontal-scroll version.
   These selectors intentionally outrank earlier rules that set border:1px !important. */
.card .card-main > .altthumbs-wrap--owners,
.card .card-main > .altthumbs-wrap.altthumbs-wrap--owners,
.card .card-main > .altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll,
.card .card-main > .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll,
.card .altthumbs-wrap--owners,
.card .altthumbs-wrap.altthumbs-wrap--owners,
.card .altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll,
.card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll{
  border:0 !important;
  border-color:transparent !important;
  outline:0 !important;
  box-shadow:none !important;
}

/* Inner owner scroll viewport should not create a framed window either. */
.card .altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-viewport,
.card .altthumbs-wrap.altthumbs-wrap--owners.altthumbs-wrap--owners-desktop-scroll .alt-owner-scroll-viewport{
  border:0 !important;
  border-color:transparent !important;
  outline:0 !important;
  box-shadow:none !important;
}

/* Gallery thumbnail strip/window */
.ccc-gallery-thumbs,
.card .ccc-gallery-thumbs{
  border:0 !important;
  border-top:0 !important;
  border-color:transparent !important;
  outline:0 !important;
  box-shadow:none !important;
}

/* Companion Value Highlights panel */
.card .cc-highlights-panel,
.cc-highlights-panel{
  border:0 !important;
  border-color:transparent !important;
  outline:0 !important;
  box-shadow:none !important;
}

/* === SOURCE: 141-additional-information-border-final-override.css === */
/* Additional Information panel/window */
.card .more,
.card .details-panels .more,
.card .more[style*="display: block"],
.card .details-panels .more[style*="display: block"]{
  border:0 !important;
  border-color:transparent !important;
  outline:0 !important;
  box-shadow:none !important;
}

/* Prevent hover/touch rules from reintroducing the frame. */
.card .more:hover,
.card .more:active,
.card .details-panels .more:hover,
.card .details-panels .more:active{
  border:0 !important;
  border-color:transparent !important;
  outline:0 !important;
  box-shadow:none !important;
}

/* === SOURCE: 142-value-additional-purple-background-final-override.css === */
/* Keep these panels borderless, but remove the purple glow/tint overlay. */
.card .cc-highlights-panel,
.cc-highlights-panel,
.card .details-panels .more,
.card .more,
.card .more[style*="display: block"],
.card .details-panels .more[style*="display: block"]{
  background:rgba(255,255,255,.012) !important;
  background-image:none !important;
  box-shadow:none !important;
  border:0 !important;
  border-color:transparent !important;
  outline:0 !important;
}

/* Hover/touch states should stay neutral too. */
.card .cc-highlights-panel:hover,
.card .cc-highlights-panel:active,
.cc-highlights-panel:hover,
.cc-highlights-panel:active,
.card .details-panels .more:hover,
.card .details-panels .more:active,
.card .more:hover,
.card .more:active{
  background:rgba(255,255,255,.012) !important;
  background-image:none !important;
  box-shadow:none !important;
  border:0 !important;
  border-color:transparent !important;
  outline:0 !important;
}

/* Remove any decorative purple/top highlight stripe from both panels. */
.card .cc-highlights-panel::before,
.cc-highlights-panel::before,
.card .details-panels .more::before,
.card .more::before{
  display:none !important;
  content:none !important;
  background:none !important;
  box-shadow:none !important;
}

/* === SOURCE: 143-mobile-additional-info-border-restore.css === */
/* Mobile only: restore a very subtle grey frame around the Additional Information window.
   This comes after the global border-removal overrides, so it wins only on phones. */
@media (max-width:780px){
  .card .more,
  .card .more[style*="display: block"],
  .card .details-panels .more,
  .card .details-panels .more[style*="display: block"]{
    border: 1px solid rgba(128,128,128,.18) !important;
    border-radius: 12px !important;
    box-shadow: inset 0 0 0 1px rgba(128,128,128,.04) !important;
    box-sizing: border-box !important;
  }

  .card .more:hover,
  .card .more:active,
  .card .details-panels .more:hover,
  .card .details-panels .more:active{
    border: 1px solid rgba(128,128,128,.18) !important;
    box-shadow: inset 0 0 0 1px rgba(128,128,128,.04) !important;
  }
}

/* === SOURCE: 144-ccc-definitive-button-hover-border-fix.css === */
/*
  Fixes the broken two-step hover highlight:
  - removes underline/partial-border pseudo-elements
  - prevents border-bottom-only rules from winning
  - uses a stable full button frame + inset hover ring
*/

/* Browse List / checklist icon in the top bar */
.topbar #listBtn.icon-btn,
#listBtn.icon-btn{
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  min-height:44px !important;
  padding:10px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:10px !important;
  background:var(--panel) !important;
  color:var(--text) !important;
  opacity:1 !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 0 rgba(255,255,255,0) !important;
  transform:none !important;
  transition:background-color .14s ease, background .14s ease, box-shadow .14s ease, color .14s ease, opacity .14s ease !important;
}
.topbar #listBtn.icon-btn::before,
.topbar #listBtn.icon-btn::after,
#listBtn.icon-btn::before,
#listBtn.icon-btn::after{
  content:none !important;
  display:none !important;
}
@media (hover: hover) and (pointer: fine){
.topbar #listBtn.icon-btn:hover,
#listBtn.icon-btn:hover{
  border-color:rgba(255,255,255,.6) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  opacity:1 !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
}
}
.topbar #listBtn.icon-btn:focus-visible,
#listBtn.icon-btn:focus-visible{
  border-color:rgba(255,255,255,.6) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  opacity:1 !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
}

/* Top-level comic cut arrows under search */
#result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control),
#result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control),
#comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control){
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  width:44px !important;
  height:40px !important;
  min-width:44px !important;
  min-height:40px !important;
  padding:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
  border-radius:12px !important;
  background:transparent !important;
  color:var(--text) !important;
  opacity:1 !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 0 rgba(255,255,255,0) !important;
  transform:none !important;
  transition:background-color .14s ease, background .14s ease, box-shadow .14s ease, color .14s ease, opacity .14s ease !important;
}
#result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::before,
#result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::after,
#result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::before,
#result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::after,
#comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::before,
#comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::after{
  content:none !important;
  display:none !important;
  opacity:0 !important;
  transform:none !important;
}
@media (hover: hover) and (pointer: fine){
#result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):hover,
#result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):hover,
#comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):hover{
  border-color:rgba(255,255,255,.12) !important;
  border-bottom-color:rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  opacity:1 !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
}
}
#result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):focus-visible,
#result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):focus-visible,
#comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):focus-visible{
  border-color:rgba(255,255,255,.12) !important;
  border-bottom-color:rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  opacity:1 !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
}

/* Card-mounted left/right arrows: these had later rules that could beat the top-nav selectors */
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #backToSetBtn:not(.ccc-shared-icon-control),
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #nextComicCutBtn:not(.ccc-shared-icon-control),
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:not(.ccc-shared-icon-control),
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control){
  box-sizing:border-box !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
  border-radius:12px !important;
  background:var(--panel) !important;
  color:var(--text) !important;
  box-shadow:inset 0 0 0 0 rgba(255,255,255,0) !important;
  transform:none !important;
  text-decoration:none !important;
  transition:background-color .14s ease, background .14s ease, box-shadow .14s ease, color .14s ease, opacity .14s ease !important;
}
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #backToSetBtn:not(.ccc-shared-icon-control)::before,
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #backToSetBtn:not(.ccc-shared-icon-control)::after,
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #nextComicCutBtn:not(.ccc-shared-icon-control)::before,
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #nextComicCutBtn:not(.ccc-shared-icon-control)::after,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:not(.ccc-shared-icon-control)::before,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:not(.ccc-shared-icon-control)::after,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::before,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control)::after{
  content:none !important;
  display:none !important;
  opacity:0 !important;
  transform:none !important;
}
@media (hover: hover) and (pointer: fine){
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #backToSetBtn:not(.ccc-shared-icon-control):hover,
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #nextComicCutBtn:not(.ccc-shared-icon-control):hover,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:not(.ccc-shared-icon-control):hover,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):hover{
  border-color:rgba(255,255,255,.12) !important;
  border-bottom-color:rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
  text-decoration:none !important;
}
}
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #backToSetBtn:not(.ccc-shared-icon-control):focus-visible,
.card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav #nextComicCutBtn:not(.ccc-shared-icon-control):focus-visible,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-btn:not(.ccc-shared-icon-control):focus-visible,
.card .comic-cut-card-action-stack > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control):focus-visible{
  border-color:rgba(255,255,255,.12) !important;
  border-bottom-color:rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  outline:0 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
  text-decoration:none !important;
}

/* Logged-in Set Checklist pill: same stable full-frame hover */
#comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control),
.card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control){
  border:1px solid rgba(255,255,255,.12) !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.04) !important;
  box-shadow:inset 0 0 0 0 rgba(255,255,255,0) !important;
}
@media (hover: hover) and (pointer: fine){
#comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control):hover,
.card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control):hover{
  border-color:rgba(255,255,255,.12) !important;
  border-bottom-color:rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.08) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  color:#fff !important;
}
}
#comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control):focus-visible,
.card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode #backToSetBtn:not(.ccc-shared-icon-control):focus-visible{
  border-color:rgba(255,255,255,.12) !important;
  border-bottom-color:rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.08) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  color:#fff !important;
}

@media (max-width:780px){
  #result > #comicCutNav.comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control),
  #result > .comic-cut-nav .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control),
  #comicCutNav.comic-cut-nav > .comic-cut-nav-icon-btn:not(.ccc-shared-icon-control){
    width:42px !important;
    height:38px !important;
    min-width:42px !important;
    min-height:38px !important;
  }
}

/* === SOURCE: 145-browse-list-match-random-card-button-style.css === */
/* Make the Browse List button match the Random Card button styling. */
#listBtn.icon-btn{
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:10px !important;
  border:1px solid var(--border) !important;
  border-radius:10px !important;
  background:var(--panel) !important;
  color:var(--text) !important;
  cursor:pointer !important;
  opacity:1 !important;
  outline:none !important;
  box-shadow:none !important;
  transform:none !important;
  transition:background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease !important;
}

@media (hover: hover) and (pointer: fine){

#listBtn.icon-btn:hover{
  border-color:rgba(255,255,255,0.6) !important;
  background:rgba(255,255,255,0.08) !important;
  color:#fff !important;
  box-shadow:none !important;
  outline:none !important;
  opacity:1 !important;
  transform:none !important;
}
}

#listBtn.icon-btn:focus-visible{
  border-color:rgba(255,255,255,0.6) !important;
  background:rgba(255,255,255,0.08) !important;
  color:#fff !important;
  box-shadow:none !important;
  outline:none !important;
  opacity:1 !important;
  transform:none !important;
}

#listBtn.icon-btn:active{
  transform:none !important;
}

/* === SOURCE: 147-desktop-public-member-tall-additional-info.css === */
@media (min-width:781px){
  .card .desktop-member-tall-info-layout{
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr) !important;
    gap:12px !important;
    align-items:stretch !important;
    margin-top:0 !important;
  }

  .card .desktop-member-info-left{
    min-width:0 !important;
    display:grid !important;
    grid-template-rows:auto minmax(0, 360px) !important;
    gap:12px !important;
  }

  .card .desktop-member-info-left > .pillgrid{
    grid-template-columns:1fr !important;
    gap:10px !important;
    margin:0 !important;
  }

  .card .desktop-member-info-left > .pillgrid .pill{
    min-height:40px !important;
  }

  .card .desktop-member-info-left > .cc-highlights-panel{
    height:360px !important;
    max-height:360px !important;
    margin:0 !important;
  }

  .card .desktop-member-tall-info-layout > .more,
  .card .desktop-member-tall-info-layout > .more[style*="display: block"]{
    display:block !important;
    height:492px !important;
    max-height:492px !important;
    margin:0 !important;
    overflow:auto !important;
  }
}

@media (max-width:780px){
  .card .desktop-member-tall-info-layout{
    display:contents !important;
  }
}

/* === SOURCE: 148-ccc-single-source-uniform-three-button-nav.css === */
/*
  Legacy card comic-cut navigation layout. It intentionally does not replace
  click handlers. The desktop thumbnail-mounted navigation is excluded so its
  compact buttons are controlled by the dedicated desktop source rules.
*/
html body #comicCutNav.comic-cut-nav:not(.ccc-thumbnail-nav-control).is-visible,
html body .card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav:not(.ccc-thumbnail-nav-control).is-visible,
html body #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control).comic-cut-nav.is-visible,
html body .card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control).comic-cut-nav.is-visible{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:8px !important;
  width:100% !important;
  max-width:none !important;
  margin:0 0 10px !important;
  padding:0 !important;
  align-items:center !important;
  justify-items:stretch !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

html body #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control),
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control),
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control),
html body #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control),
html body #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control),
html body #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control){
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  display:inline-flex !important;
  visibility:visible !important;
  align-items:center !important;
  justify-content:center !important;
  justify-self:stretch !important;
  align-self:center !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:40px !important;
  min-height:40px !important;
  max-height:40px !important;
  padding:0 !important;
  margin:0 !important;
  gap:0 !important;
  border:1px solid var(--border) !important;
  border-bottom:1px solid var(--border) !important;
  border-radius:10px !important;
  background:var(--panel) !important;
  color:var(--text) !important;
  opacity:1 !important;
  overflow:hidden !important;
  box-shadow:none !important;
  transform:none !important;
  text-align:center !important;
  text-decoration:none !important;
  white-space:normal !important;
  flex:none !important;
  cursor:pointer !important;
  pointer-events:auto !important;
  transition:background .15s ease, border-color .15s ease, color .15s ease !important;
}

html body #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control),
html body #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control){
  grid-column:1 !important;
}
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control),
html body #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control){
  grid-column:2 !important;
}
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control),
html body #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control),
html body .card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control){
  grid-column:3 !important;
}

html body #comicCutNav:not(.ccc-thumbnail-nav-control) #comicCutNavCounters,
html body #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control) #comicCutNavCounters,
html body .card .comic-cut-card-action-stack > #comicCutNav:not(.ccc-thumbnail-nav-control) #comicCutNavCounters{
  display:none !important;
  visibility:hidden !important;
}

html body #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control)::before,
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control)::after,
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control)::before,
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control)::after,
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control)::before,
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control)::after{
  content:none !important;
  display:none !important;
}

html body #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control) .material-symbols-outlined,
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control) .material-symbols-outlined,
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control) .material-symbols-outlined{
  display:block !important;
  flex:0 0 auto !important;
  font-size:22px !important;
  line-height:1 !important;
}

@media (hover: hover) and (pointer: fine){

html body #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control):hover:not(:disabled){
  border-color:rgba(255,255,255,.6) !important;
  border-bottom-color:rgba(255,255,255,.6) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  outline:none !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
}
}

html body #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control):focus-visible,
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control):focus-visible,
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control):focus-visible{
  border-color:rgba(255,255,255,.6) !important;
  border-bottom-color:rgba(255,255,255,.6) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  outline:none !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
}

html body #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control)[disabled],
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control)[disabled],
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control)[disabled],
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control):disabled,
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control):disabled,
html body #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control):disabled{
  opacity:.38 !important;
  cursor:not-allowed !important;
  pointer-events:none !important;
  background:var(--panel-2) !important;
  border-color:rgba(255,255,255,.05) !important;
  color:var(--muted) !important;
}



html body .comic-cuts-row.ccc-checklist-highlight{
  border-color:rgba(154,139,255,.82) !important;
  background:rgba(154,139,255,.20) !important;
  box-shadow:0 0 0 1px rgba(154,139,255,.28) inset, 0 12px 28px rgba(154,139,255,.12) !important;
}
html body .comic-cuts-row.ccc-checklist-highlight .comic-cuts-name{
  color:#fff !important;
}

@media (max-width:780px){
  html body #comicCutNav.comic-cut-nav:not(.ccc-thumbnail-nav-control).is-visible,
  html body .card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav:not(.ccc-thumbnail-nav-control).is-visible,
  html body #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control).comic-cut-nav.is-visible,
  html body .card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode:not(.ccc-thumbnail-nav-control).comic-cut-nav.is-visible{
    gap:8px !important;
  }
  html body #comicCutNav:not(.ccc-thumbnail-nav-control) #setChecklistBtn:not(.ccc-shared-icon-control),
  html body #comicCutNav:not(.ccc-thumbnail-nav-control) #backToSetBtn:not(.ccc-shared-icon-control),
  html body #comicCutNav:not(.ccc-thumbnail-nav-control) #nextComicCutBtn:not(.ccc-shared-icon-control){
    height:38px !important;
    min-height:38px !important;
    max-height:38px !important;
  }
}

/* === SOURCE: 149-mobile-logged-in-owner-thumbs-after-pills-final.css === */
@media (max-width:780px){
  /* Use the card class set in renderCard(), not body auth classes, so this only affects
     logged-in full card views and cannot leak into logged-out/mobile-lite layouts. */
  html body .card.ccc-logged-in-card > .card-main,
  html body .card.ccc-logged-in-card > :nth-child(2){
    display:contents !important;
  }

  /* Keep the pills ahead of the owner thumbnail scroller even when earlier/later
     .altthumbs-wrap--owners rules force grid-column/full-width behavior. */
  html body .card.ccc-logged-in-card .card-main > .pillgrid{
    grid-column:2 !important;
    order:10 !important;
    align-self:start !important;
    position:relative !important;
    z-index:2 !important;
  }

  /* The Full Detail action row must follow the summary pills. Because .card-main
     is display:contents here, it needs an explicit order just like the other
     flattened children. */
  html body .card.ccc-logged-in-card .card-main > .ccc-mobile-full-action-row{
    grid-column:1 / -1 !important;
    order:15 !important;
  }

  /* Keep the restored Value Highlight/status row from touching the main image. */
  html body .card.ccc-logged-in-card > .thumb > .comic-cut-card-counter-slot{
    margin-top:10px !important;
  }

  /* Logged-in mobile final order:
     1) main image + summary pills
     2) Master Database issue thumbnails
     3) other-owner thumbnail scroller
     4) Value Highlights / Additional Information */
  html body .card.ccc-logged-in-card .card-main > .altthumbs-wrap--master-mobile-placement,
  html body .card.ccc-logged-in-card .card-main > .altthumbs-wrap.altthumbs-wrap--master-mobile-placement{
    grid-column:1 / -1 !important;
    order:20 !important;
    position:relative !important;
    z-index:1 !important;
    margin-top:10px !important;
  }

  html body .card.ccc-logged-in-card .card-main > .altthumbs-wrap--owners,
  html body .card.ccc-logged-in-card .card-main > .altthumbs-wrap.altthumbs-wrap--owners{
    grid-column:1 / -1 !important;
    order:30 !important;
    position:relative !important;
    z-index:1 !important;
    margin-top:10px !important;
  }

  html body .card.ccc-logged-in-card .card-main > .details-panels,
  html body .card.ccc-logged-in-card .card-main > .more,
  html body .card.ccc-logged-in-card .card-main > .details-toggle{
    order:40 !important;
  }
}

/* === SOURCE: 150-mobile-logged-in-1cc-gallery-toggle-final.css === */
@media (max-width:780px){
  html body .card.ccc-logged-in-card .card-main > .altthumbs-wrap--mobile-1cc-toggle,
  html body .card.ccc-logged-in-card .card-main > .altthumbs-wrap.altthumbs-wrap--mobile-1cc-toggle{
    display:block !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    padding-top:0 !important;
  }

  html body .card.ccc-logged-in-card .mobile-1cc-gallery-toggle{
    appearance:none;
    -webkit-appearance:none;
    display:block;
    width:100%;
    min-height:38px;
    margin:8px 0 0 0;
    padding:8px 12px;
    border:1px solid var(--border);
    border-radius:12px;
    background:rgba(255,255,255,.04);
    color:var(--text);
    cursor:pointer;
    font-size:13px;
    font-weight:800;
    letter-spacing:.02em;
    text-align:center;
    transition:border-color .18s ease, background .18s ease, transform .18s ease;
  }

  html body .card.ccc-logged-in-card .mobile-1cc-gallery-toggle:hover,
  html body .card.ccc-logged-in-card .mobile-1cc-gallery-toggle:focus-visible,
  html body .card.ccc-logged-in-card .mobile-1cc-gallery-toggle[aria-pressed="true"]{
    border-color:rgba(154,139,255,.62);
    background:rgba(154,139,255,.18);
    outline:none;
  }

  html body .card.ccc-logged-in-card .mobile-1cc-gallery-toggle:active{
    transform:translateY(1px);
  }

  html body .card.ccc-logged-in-card .altthumbs-wrap--mobile-1cc-toggle > .altthumbs,
  html body .card.ccc-logged-in-card .altthumbs-wrap--mobile-1cc-toggle > .mobile-1cc-gallery-grid{
    display:flex !important;
    flex-wrap:nowrap !important;
    grid-template-columns:none !important;
    gap:8px !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    width:max-content !important;
    min-width:100% !important;
  }

  html body .card.ccc-logged-in-card .altthumbs-wrap--mobile-1cc-toggle > .altthumbs[hidden],
  html body .card.ccc-logged-in-card .altthumbs-wrap--mobile-1cc-toggle > .mobile-1cc-gallery-grid[hidden]{
    display:none !important;
  }

  html body .card.ccc-logged-in-card .altthumbs-wrap--mobile-1cc-toggle .mobile-1cc-separator{
    flex:0 0 1px !important;
    width:1px !important;
    min-width:1px !important;
    height:96px !important;
    margin:0 2px !important;
    background:linear-gradient(to bottom, transparent, rgba(255,255,255,.22), transparent) !important;
  }
}

/* === SOURCE: 151-mobile-logged-in-1cc-gallery-toggle-nav-placement.css === */
@media (max-width:780px){
  html body .card.ccc-logged-in-card .altthumbs-wrap--mobile-1cc-toggle{
    padding-bottom:6px !important;
  }

  html body .card.ccc-logged-in-card .altthumbs-wrap--mobile-1cc-toggle > .mobile-1cc-gallery-toggle{
    display:none !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style{
    appearance:none !important;
    -webkit-appearance:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    min-height:38px !important;
    margin:0 0 10px 0 !important;
    padding:8px !important;
    border:1px solid transparent !important;
    border-radius:12px !important;
    background:transparent !important;
    color:rgba(255,255,255,.92) !important;
    cursor:pointer !important;
    font-size:13px !important;
    font-weight:700 !important;
    line-height:1.2 !important;
    letter-spacing:.01em !important;
    text-align:center !important;
    box-shadow:none !important;
    transition:border-color .18s ease, background .18s ease, color .18s ease, opacity .18s ease !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style:hover,
  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style:focus-visible,
  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style[aria-pressed="true"]{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    color:#ffffff !important;
    outline:none !important;
    transform:none !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style:active{
    transform:translateY(1px) !important;
  }
}

/* === SOURCE: 152-mobile-logged-in-1cc-gallery-toggle-nav-polish-final.css === */
@media (max-width:780px){
  html body .card.ccc-logged-in-card .comic-cut-card-action-stack{
    gap:8px !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style{
    box-sizing:border-box !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    height:40px !important;
    min-height:40px !important;
    max-height:40px !important;
    margin:0 !important;
    padding:0 10px !important;
    border:1px solid rgba(255,255,255,.12) !important;
    border-bottom:1px solid rgba(255,255,255,.12) !important;
    border-radius:12px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:inset 0 0 0 0 rgba(255,255,255,0) !important;
    cursor:pointer !important;
    font-size:13px !important;
    font-weight:700 !important;
    line-height:1 !important;
    letter-spacing:.01em !important;
    text-align:center !important;
    text-decoration:none !important;
    transform:none !important;
    transition:background-color .14s ease, background .14s ease, box-shadow .14s ease, color .14s ease, opacity .14s ease !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style:hover,
  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style:focus-visible,
  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style[aria-pressed="true"]{
    border-color:rgba(255,255,255,.12) !important;
    border-bottom-color:rgba(255,255,255,.12) !important;
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
    outline:0 !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
    transform:none !important;
    text-decoration:none !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style:active{
    transform:none !important;
  }
}

/* === SOURCE: 153-mobile-logged-in-1cc-gallery-toggle-match-nav-final.css === */
@media (max-width:780px){
  /* Keep normal spacing for the existing action rows, but pull the 1CC row closer to the Previous/Next row. */
  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .comic-cut-nav.is-visible + .mobile-1cc-gallery-toggle--nav-style{
    margin-top:-4px !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style{
    box-sizing:border-box !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    min-width:0 !important;
    height:40px !important;
    min-height:40px !important;
    max-height:40px !important;
    margin-bottom:0 !important;
    padding:0 !important;
    border:1px solid var(--border) !important;
    border-radius:12px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:none !important;
    outline:0 !important;
    cursor:pointer !important;
    font-size:13px !important;
    font-weight:700 !important;
    line-height:1 !important;
    letter-spacing:.01em !important;
    text-align:center !important;
    text-decoration:none !important;
    transform:none !important;
    transition:border-color .18s ease, background .18s ease, color .18s ease, opacity .18s ease !important;
  }

  /* No persistent white outline/border when selected/open. Hover/focus matches the existing Next Comic Cut button. */
  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style:hover,
  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style:focus-visible{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
    box-shadow:none !important;
    outline:0 !important;
    transform:none !important;
    text-decoration:none !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style[aria-pressed="true"]{
    border-color:var(--border) !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:none !important;
    outline:0 !important;
    transform:none !important;
    text-decoration:none !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style:active{
    transform:translateY(1px) !important;
    box-shadow:none !important;
  }
}

/* === SOURCE: 154-mobile-logged-in-1cc-gallery-toggle-tightest-spacing-final.css === */
@media (max-width:780px){
  /* Remove extra space created by older nav margin + grid gap before the 1CC row. */
  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav.is-visible,
  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode.comic-cut-nav.is-visible{
    margin-bottom:0 !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav.is-visible + .mobile-1cc-gallery-toggle--nav-style,
  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode.comic-cut-nav.is-visible + .mobile-1cc-gallery-toggle--nav-style{
    margin-top:-6px !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style{
    height:38px !important;
    min-height:38px !important;
    max-height:38px !important;
    border:1px solid var(--border) !important;
    border-bottom:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    box-shadow:none !important;
    outline:0 !important;
    margin-bottom:0 !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style[aria-pressed="true"]{
    border-color:var(--border) !important;
    border-bottom-color:var(--border) !important;
    background:var(--panel) !important;
    box-shadow:none !important;
    outline:0 !important;
  }
}

/* === SOURCE: 155-mobile-logged-in-thumbnail-swipe-final-fix.css === */
@media (max-width:780px){
  .card .card-main > .altthumbs-wrap--master-mobile-placement,
  .card .card-main > .altthumbs-wrap--mobile-1cc-toggle{
    width:100% !important;
    max-width:100% !important;
    max-height:none !important;
    margin-top:10px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    touch-action:pan-x pan-y !important;
    overscroll-behavior-x:contain !important;
    overscroll-behavior-y:auto !important;
    scroll-behavior:smooth;
    padding:8px !important;
  }

  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumbs,
  .card .card-main > .altthumbs-wrap--mobile-1cc-toggle .altthumbs,
  .card .card-main > .altthumbs-wrap--mobile-1cc-toggle .mobile-1cc-gallery-grid{
    display:flex !important;
    flex-wrap:nowrap !important;
    grid-template-columns:none !important;
    gap:8px !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    width:max-content !important;
    min-width:100% !important;
  }

  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb,
  .card .card-main > .altthumbs-wrap--mobile-1cc-toggle .altthumb,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb:hover,
  .card .card-main > .altthumbs-wrap--mobile-1cc-toggle .altthumb:hover,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb:active,
  .card .card-main > .altthumbs-wrap--mobile-1cc-toggle .altthumb:active,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb:focus,
  .card .card-main > .altthumbs-wrap--mobile-1cc-toggle .altthumb:focus,
  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb:focus-visible,
  .card .card-main > .altthumbs-wrap--mobile-1cc-toggle .altthumb:focus-visible{
    flex:0 0 72px !important;
    width:72px !important;
    min-width:72px !important;
    max-width:72px !important;
    height:96px !important;
    min-height:96px !important;
    max-height:96px !important;
    padding:2px !important;
    border-radius:7px !important;
    touch-action:pan-x pan-y !important;
  }

  .card .card-main > .altthumbs-wrap--master-mobile-placement .altthumb img,
  .card .card-main > .altthumbs-wrap--mobile-1cc-toggle .altthumb img{
    width:100% !important;
    height:100% !important;
    aspect-ratio:3 / 4 !important;
    object-fit:contain !important;
    border-radius:5px !important;
  }
}

/* === SOURCE: 156-mobile-logged-in-1cc-toggle-above-value-and-scroll-fix.css === */
@media (max-width:780px){
  html body .card.ccc-logged-in-card .card-main > .mobile-1cc-gallery-toggle--value-style{
    grid-column:1 / -1 !important;
    order:35 !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    min-height:38px !important;
    margin:4px 0 6px 0 !important;
    padding:8px !important;
    border:1px solid transparent !important;
    border-radius:12px !important;
    background:transparent !important;
    color:var(--text) !important;
    box-shadow:none !important;
    outline:0 !important;
    cursor:pointer !important;
    font-size:13px !important;
    font-weight:700 !important;
    line-height:1.2 !important;
    letter-spacing:.01em !important;
    text-align:center !important;
    text-decoration:none !important;
    transform:none !important;
    transition:border-color .18s ease, background .18s ease, color .18s ease, opacity .18s ease !important;
  }

  html body .card.ccc-logged-in-card .card-main > .mobile-1cc-gallery-toggle--value-style:hover,
  html body .card.ccc-logged-in-card .card-main > .mobile-1cc-gallery-toggle--value-style:focus-visible{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    color:#ffffff !important;
    box-shadow:none !important;
    outline:0 !important;
  }

  html body .card.ccc-logged-in-card .card-main > .mobile-1cc-gallery-toggle--value-style[aria-pressed="true"]{
    border-color:transparent !important;
    background:transparent !important;
    color:var(--text) !important;
    box-shadow:none !important;
    outline:0 !important;
  }

  html body .card.ccc-logged-in-card .card-main > .mobile-1cc-gallery-toggle--value-style:active{
    transform:translateY(1px) !important;
  }

  html body .card.ccc-logged-in-card .card-main > .details-panels{
    order:40 !important;
  }

  html body .card.ccc-logged-in-card .comic-cut-card-action-stack > .mobile-1cc-gallery-toggle--nav-style{
    display:none !important;
  }

  html body .card.ccc-logged-in-card .card-main > .altthumbs-wrap--mobile-1cc-toggle{
    scroll-behavior:auto !important;
    overscroll-behavior-x:contain !important;
    touch-action:pan-x pan-y !important;
    -webkit-overflow-scrolling:touch !important;
  }
}

/* === SOURCE: 157-mobile-logged-in-1cc-button-align-thumbnail-width-final.css === */
@media (max-width:780px){
  html body .card.ccc-logged-in-card .card-main > .mobile-1cc-gallery-toggle--value-style{
    grid-column:1 / -1 !important;
    justify-self:stretch !important;
    align-self:stretch !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  html body .card.ccc-logged-in-card .card-main > .altthumbs-wrap--mobile-1cc-toggle{
    grid-column:1 / -1 !important;
    justify-self:stretch !important;
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }
}

/* === SOURCE: 158-mobile-logged-in-1cc-toggle-set-checklist-style-final.css === */
@media (max-width:780px){
  html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style,
  html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style[aria-pressed="true"],
  html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style:focus,
  html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style:focus-visible,
  html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style:active{
    grid-column:1 / -1 !important;
    justify-self:stretch !important;
    align-self:stretch !important;
    box-sizing:border-box !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    display:inline-flex !important;
    visibility:visible !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:38px !important;
    min-height:38px !important;
    max-height:38px !important;
    padding:0 !important;
    margin:4px 0 6px 0 !important;
    gap:0 !important;
    border:1px solid var(--border) !important;
    border-bottom:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    opacity:1 !important;
    overflow:hidden !important;
    box-shadow:none !important;
    outline:0 !important;
    transform:none !important;
    text-align:center !important;
    text-decoration:none !important;
    white-space:normal !important;
    cursor:pointer !important;
    pointer-events:auto !important;
    font-size:13px !important;
    font-weight:700 !important;
    line-height:1 !important;
    letter-spacing:.01em !important;
    transition:background .15s ease, border-color .15s ease, color .15s ease !important;
  }

  /* Mobile/touch: do not keep the white hover/focus border after tapping the toggle. */
  @media (hover:none){
    html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style:hover,
    html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style[aria-pressed="true"]:hover{
      border-color:var(--border) !important;
      border-bottom-color:var(--border) !important;
      background:var(--panel) !important;
      color:var(--text) !important;
      box-shadow:none !important;
      outline:0 !important;
    }
  }

  /* Desktop-style hover only where hover really exists; mirrors Set Checklist without affecting mobile taps. */
  @media (hover:hover) and (pointer:fine){
    html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style:hover{
      border-color:rgba(255,255,255,.6) !important;
      border-bottom-color:rgba(255,255,255,.6) !important;
      background:rgba(255,255,255,.08) !important;
      color:#fff !important;
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
      outline:none !important;
      transform:none !important;
    }
  }
}

/* === SOURCE: 159-first-appearance-value-highlight-final-gold-override.css === */
.card .cc-highlight-row.cc-highlight-first-appearance-comic-cut,
.card .cc-highlight-row.cc-highlight-first-appearance-comic-cut.ccg-comic-book-details{
  --cc-highlight-accent: rgba(255,214,120,.90) !important;
  --ccg-accent: rgba(255,214,120,.90) !important;
  --ccg-soft: rgba(255,214,120,.082) !important;
}
.card .cc-highlight-row.cc-highlight-first-appearance-comic-cut .cc-highlight-icon,
.card .cc-highlight-row.cc-highlight-first-appearance-comic-cut .cc-highlight-icon .material-symbols-outlined,
.card .cc-highlight-row.cc-highlight-first-appearance-comic-cut .cc-highlight-label{
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  color: rgba(255,214,120,.90) !important;
  text-shadow: 0 0 18px rgba(255,214,120,.20) !important;
}

/* === SOURCE: 160-sets-featuring-this-issue-neon-blue-specificity-final.css === */
/* Final high-specificity override:
   the field-group color system gives comic-cut-info rows a purple accent with
   a more specific !important selector, so this row needs to beat that rule. */
.card .cc-highlights-panel .cc-highlight-row.cc-highlight-sets-featuring-this-issue,
.card .cc-highlights-panel .cc-highlight-row.cc-highlight-sets-featuring-this-issue.ccg-comic-cut-info{
  --cc-highlight-accent: #00b7ff !important;
  --ccg-accent: #00b7ff !important;
}

.card .cc-highlights-panel .cc-highlight-row.cc-highlight-sets-featuring-this-issue .cc-highlight-icon,
.card .cc-highlights-panel .cc-highlight-row.cc-highlight-sets-featuring-this-issue .cc-highlight-icon .material-symbols-outlined,
.card .cc-highlights-panel .cc-highlight-row.cc-highlight-sets-featuring-this-issue .cc-highlight-label,
.card .cc-highlights-panel .cc-highlight-row.cc-highlight-sets-featuring-this-issue.ccg-comic-cut-info .cc-highlight-icon,
.card .cc-highlights-panel .cc-highlight-row.cc-highlight-sets-featuring-this-issue.ccg-comic-cut-info .cc-highlight-icon .material-symbols-outlined,
.card .cc-highlights-panel .cc-highlight-row.cc-highlight-sets-featuring-this-issue.ccg-comic-cut-info .cc-highlight-label{
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  color: #00b7ff !important;
  -webkit-text-fill-color: #00b7ff !important;
  fill: #00b7ff !important;
  text-shadow: 0 0 18px rgba(0,183,255,.46) !important;
}

.card .cc-highlights-panel .cc-highlight-row.cc-highlight-sets-featuring-this-issue .cc-highlight-value,
.card .cc-highlights-panel .cc-highlight-row.cc-highlight-sets-featuring-this-issue.ccg-comic-cut-info .cc-highlight-value{
  color: rgba(255,255,255,.96) !important;
  -webkit-text-fill-color: rgba(255,255,255,.96) !important;
  text-shadow: none !important;
}

/* === SOURCE: 161-mobile-value-highlights-top-spacing-tighten.css === */
@media (max-width:780px){
  /* Mobile only: keep the panel stack compact, but add clearer separation before Value Highlight. */
  html body .card .card-main > .details-panels{
    margin-top:2px !important;
    gap:6px !important;
  }

  html body .card .details-panels > .cc-highlights-panel{
    margin-top:6px !important;
  }

  /* When logged in, the 1CC toggle sits directly above Value Highlights; trim its lower gap. */
  html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style,
  html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style[aria-pressed="true"],
  html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style:focus,
  html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style:focus-visible,
  html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style:active{
    margin-bottom:2px !important;
  }
}

/* === SOURCE: 162-mobile-final-fast-controls-and-thumb-gesture-fix.css === */
@media (max-width:780px){
  /* Fast native taps: no custom touchend-to-click delay layer. */
  #randomCardDayBtn,
  #comicCutNav #backToSetBtn,
  #comicCutNav #nextComicCutBtn,
  #addComicCutBtn,
  #masterAddBtn,
  .right .left-protip-shortcut-btn,
  .right .auth-btn{
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    -webkit-touch-callout: none !important;
    -webkit-user-select: none !important;
    user-select: none !important;
  }

  #randomCardDayBtn:active,
  #comicCutNav #backToSetBtn:active,
  #comicCutNav #nextComicCutBtn:active,
  #addComicCutBtn:active,
  #masterAddBtn:active{
    transition: none !important;
    transform: none !important;
  }


  /* Thumbnail windows: allow horizontal swipes and vertical page-scroll gestures. */
  html body:not(.ccc-body-scroll-locked) .card .altthumbs-wrap,
  html body:not(.ccc-body-scroll-locked) .card .altthumbs-wrap .altthumbs,
  html body:not(.ccc-body-scroll-locked) .card .altthumbs-wrap .altthumb,
  html body:not(.ccc-body-scroll-locked) .card .altthumbs-wrap .altthumb img{
    touch-action: pan-x pan-y !important;
    -ms-touch-action: pan-x pan-y !important;
  }

  /* Preserve the horizontal thumbnail strips. Do not enable free dragging. */
  html body:not(.ccc-body-scroll-locked) .card .card-main > .altthumbs-wrap--master-mobile-placement,
  html body:not(.ccc-body-scroll-locked) .card .card-main > .altthumbs-wrap--mobile-1cc-toggle,
  html body:not(.ccc-body-scroll-locked) .card .card-main > .altthumbs-wrap--owners{
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-x: contain !important;
    overscroll-behavior-y: auto !important;
  }
}

/* === SOURCE: 163-ccc-mobile-scroll-responsiveness-css.css === */
@media (max-width: 820px), (hover: none) and (pointer: coarse) {
  html,
  body {
    scroll-behavior: auto !important;
    overscroll-behavior-y: auto !important;
  }

  body:not(.ccc-body-scroll-locked),
  body:not(.ccc-body-scroll-locked) .container,
  body:not(.ccc-body-scroll-locked) #result,
  body:not(.ccc-body-scroll-locked) .result,
  body:not(.ccc-body-scroll-locked) .card {
    touch-action: pan-y !important;
  }

  body:not(.ccc-body-scroll-locked) .altthumbs-wrap,
  body:not(.ccc-body-scroll-locked) .more,
  body:not(.ccc-body-scroll-locked) .mini-results,
  body:not(.ccc-body-scroll-locked) .comic-cuts-list,
  body:not(.ccc-body-scroll-locked) .for-you-grid-wrap {
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: auto !important;
  }

  body.ccc-mobile-render-settling .card,
  body.ccc-mobile-render-settling .altthumbs-wrap,
  body.ccc-mobile-render-settling .more,
  body.ccc-mobile-render-settling .mini-results,
  body.ccc-mobile-render-settling .for-you-grid,
  body.ccc-mobile-render-settling .comic-cuts-list {
    transition: none !important;
    animation: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    will-change: auto !important;
  }

  body:not(.ccc-body-scroll-locked) .modal-dd-scroll-lock .modal-body,
  body:not(.ccc-body-scroll-locked) .modal.modal-dd-scroll-lock .modal-body {
    overflow: auto !important;
  }
}

/* === SOURCE: 164-ccc-mobile-all-users-card-bg-cleanup-css.css === */
@media (max-width: 820px), (hover: none) and (pointer: coarse) {
  /* Main result card shell: do not paint a stretched glass/background rectangle on mobile. */
  #result > .card,
  #result .card.ccc-mobile-lite-card {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    align-items: start !important;
    align-content: start !important;
  }

  /* Lite Card can safely lose the shell padding entirely. Full card keeps its layout spacing. */
  #result .card.ccc-mobile-lite-card {
    border: 0 !important;
    padding: 0 !important;
  }

  /* Kill pseudo/background layers that can show as a square below the art/button. */
  #result > .card::before,
  #result > .card::after,
  #result .card.ccc-mobile-lite-card::before,
  #result .card.ccc-mobile-lite-card::after,
  #result .card .thumb::before,
  #result .card .thumb::after,
  #result .card .ccc-mobile-lite-thumb::before,
  #result .card .ccc-mobile-lite-thumb::after,
  #result .card .ccc-mobile-lite-full-details-wrap::before,
  #result .card .ccc-mobile-lite-full-details-wrap::after,
  #result .card .ccc-mobile-lite-actions-wrap::before,
  #result .card .ccc-mobile-lite-actions-wrap::after {
    display: none !important;
    content: none !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: 0 !important;
  }

  /* The left image column must size to its content, not visually stretch down the card. */
  #result .card > .thumb,
  #result .card .thumb.ccc-mobile-lite-thumb,
  #result .card .ccc-mobile-lite-thumb {
    align-self: start !important;
    justify-self: center !important;
    align-content: flex-start !important;
    justify-content: flex-start !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    overflow: visible !important;
    contain: none !important;
    transform: none !important;
  }

  #result .card .thumb.ccc-mobile-lite-thumb,
  #result .card .ccc-mobile-lite-thumb {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  /* Keep any image backing on the actual image only, so it cannot continue below buttons. */
  #result .card > .thumb > img,
  #result .card .thumb img,
  #result .card .ccc-mobile-lite-main-img {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: contain !important;
    box-shadow: none !important;
  }

  /* These wrappers/buttons must never create the square below View Full Details / Full View. */
  #result .card .ccc-mobile-lite-full-details-wrap,
  #result .card .ccc-mobile-lite-actions-wrap,
  #result .card .thumb > div:has(button),
  #result .card .thumb > div:has(.icon-btn),
  #result .card .thumb > div:has(.auth-btn) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    overflow: visible !important;
    contain: none !important;
  }

  #result .card .ccc-mobile-lite-full-details-btn,
  #result .card .ccc-mobile-lite-full-details-btn::before,
  #result .card .ccc-mobile-lite-full-details-btn::after {
    box-shadow: none !important;
  }
}

/* === SOURCE: 165-mobile-fast-comic-cut-arrows-style.css === */
@media (max-width:780px){
  #comicCutNav #backToSetBtn,
  #comicCutNav #nextComicCutBtn{
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    transition: none !important;
    will-change: auto !important;
  }

  #comicCutNav #backToSetBtn:active,
  #comicCutNav #nextComicCutBtn:active,
  #comicCutNav #backToSetBtn.ccc-fast-arrow-active,
  #comicCutNav #nextComicCutBtn.ccc-fast-arrow-active{
    transform: none !important;
    transition: none !important;
    opacity: .72 !important;
  }

  body.ccc-fast-arrow-rendering .card,
  body.ccc-fast-arrow-rendering .card *,
  body.ccc-fast-arrow-rendering #comicCutNav,
  body.ccc-fast-arrow-rendering #comicCutNav *{
    transition: none !important;
    animation: none !important;
  }
}

/* === SOURCE: 166-mc-header-divider-award-polish-v11.css === */
/* V11: make separators feel intentional again and force individual colored award boxes back on. */
.mc-status-summary.mc-status-summary--inline::before,
.mc-status-summary.mc-status-summary--inline::after,
.mc-profile-awards::before,
.mc-most-collected-grid--compact::before{
  content:'' !important;
  display:block !important;
  height:1px !important;
  width:min(360px, 74%) !important;
  max-width:74% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  background:linear-gradient(90deg,
    transparent 0%,
    rgba(255,255,255,.10) 12%,
    rgba(255,255,255,.34) 50%,
    rgba(255,255,255,.10) 88%,
    transparent 100%) !important;
  box-shadow:none !important;
  border:0 !important;
}
.mc-status-summary.mc-status-summary--inline::before{ margin-top:0 !important; margin-bottom:7px !important; }
.mc-status-summary.mc-status-summary--inline::after{ margin-top:7px !important; margin-bottom:0 !important; }
.mc-profile-awards::before,
.mc-most-collected-grid--compact::before{ margin-top:0 !important; margin-bottom:9px !important; }

/* Keep parent areas clean/unboxed, but restore each award as its own colored box. */
.mc-profile-awards{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:8px 0 0 !important;
}
.mc-profile-awards-list{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  width:100% !important;
}
.mc-profile-award{
  width:auto !important;
  min-width:0 !important;
  min-height:34px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  padding:7px 11px !important;
  border:1px solid rgba(255,255,255,.16) !important;
  background:rgba(255,255,255,.055) !important;
  color:rgba(255,255,255,.94) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.035) !important;
}
.mc-profile-award.issue-specialist{
  border-color:rgba(255,214,0,.54) !important;
  background:linear-gradient(90deg, rgba(255,214,0,.22), rgba(255,214,0,.075)) !important;
}
.mc-profile-award.centurion{
  border-color:rgba(154,139,255,.66) !important;
  background:linear-gradient(90deg, rgba(154,139,255,.28), rgba(154,139,255,.085)) !important;
}
.mc-profile-award.key-issue{
  border-color:rgba(118,220,255,.62) !important;
  background:linear-gradient(90deg, rgba(118,220,255,.23), rgba(118,220,255,.075)) !important;
}
.mc-profile-award.issue-specialist .material-symbols-outlined{ color:#ffe89a !important; }
.mc-profile-award.centurion .material-symbols-outlined{ color:#cfc5ff !important; }
.mc-profile-award.key-issue .material-symbols-outlined{ color:#b8f1ff !important; }
.mc-profile-award-label{
  width:auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:7px !important;
  min-width:0 !important;
  white-space:normal !important;
}
.mc-profile-award-label span:last-child{
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}
@media (max-width:520px){
  .mc-status-summary.mc-status-summary--inline::before,
  .mc-status-summary.mc-status-summary--inline::after,
  .mc-profile-awards::before,
  .mc-most-collected-grid--compact::before{
    width:min(250px, 78%) !important;
    max-width:78% !important;
  }
  .mc-profile-awards-list{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:6px !important;
  }
  .mc-profile-award{
    width:100% !important;
    padding:7px 9px !important;
  }
}

/* === SOURCE: 167-mc-header-divider-award-polish-v12.css === */
/* V12: restore clean full separators and stronger individual award color boxes. */
.mc-status-summary.mc-status-summary--inline::before,
.mc-status-summary.mc-status-summary--inline::after,
.mc-profile-awards::before,
.mc-most-collected-grid--compact::before{
  content:'' !important;
  display:block !important;
  height:1px !important;
  width:100% !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
  border:0 !important;
  background:linear-gradient(90deg,
    transparent 0%,
    rgba(255,255,255,.16) 18%,
    rgba(255,255,255,.25) 50%,
    rgba(255,255,255,.16) 82%,
    transparent 100%) !important;
  box-shadow:none !important;
}
.mc-status-summary.mc-status-summary--inline::before{ margin-top:0 !important; margin-bottom:8px !important; }
.mc-status-summary.mc-status-summary--inline::after{ margin-top:8px !important; margin-bottom:0 !important; }
.mc-profile-awards::before,
.mc-most-collected-grid--compact::before{ margin-top:0 !important; margin-bottom:10px !important; }

/* Keep parent sections open/clean, but make every Collector Award a distinct colored badge box. */
.mc-profile-awards{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:8px 0 0 !important;
}
.mc-profile-awards-list{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  width:100% !important;
}
.mc-profile-award{
  width:auto !important;
  min-width:0 !important;
  min-height:36px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  padding:8px 12px !important;
  border-width:1px !important;
  border-style:solid !important;
  color:#fff !important;
  font-size:11px !important;
  font-weight:900 !important;
  letter-spacing:.055em !important;
  line-height:1.05 !important;
  text-transform:uppercase !important;
  box-shadow:0 10px 22px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.05) !important;
}
.mc-profile-award.issue-specialist{
  border-color:rgba(255,214,0,.62) !important;
  background:linear-gradient(180deg, rgba(255,214,0,.24), rgba(255,214,0,.09)) !important;
}
.mc-profile-award.centurion{
  border-color:rgba(154,139,255,.74) !important;
  background:linear-gradient(180deg, rgba(154,139,255,.34), rgba(154,139,255,.12)) !important;
}
.mc-profile-award.key-issue{
  border-color:rgba(118,220,255,.70) !important;
  background:linear-gradient(180deg, rgba(118,220,255,.26), rgba(118,220,255,.10)) !important;
}
.mc-profile-award.issue-specialist .material-symbols-outlined{ color:#ffe89a !important; }
.mc-profile-award.centurion .material-symbols-outlined{ color:#cfc5ff !important; }
.mc-profile-award.key-issue .material-symbols-outlined{ color:#b8f1ff !important; }
.mc-profile-award-label{
  width:auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  min-width:0 !important;
  white-space:normal !important;
  text-align:center !important;
}
.mc-profile-award-label span:last-child{
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}
@media (max-width:520px){
  .mc-profile-awards-list{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:7px !important;
  }
  .mc-profile-award{
    width:100% !important;
    padding:8px 10px !important;
    justify-content:center !important;
  }
}

/* === SOURCE: 168-mc-header-visual-stats-v24-final.css === */
.mc-header-visual-stats{
  grid-template-columns:1fr !important;
  gap:8px !important;
}
.mc-header-visual-stat{
  max-width:100% !important;
}

/* === SOURCE: 169-mc-header-progress-status-spacing-v34.css === */
.mc-profile-expand > .mc-progress-btn + .mc-status-summary.mc-status-summary--inline{
  margin-top:10px !important;
}
@media (max-width:620px){
  .mc-profile-expand > .mc-progress-btn + .mc-status-summary.mc-status-summary--inline{
    margin-top:12px !important;
  }
}

/* === SOURCE: 170-fausto-mobile-9-pagination-header-modal-fix.css === */
@media (max-width:780px){
  /* Make the fixed header solid on every mobile page, matching the home-page feel. */
  .topbar{
    background: linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
    box-shadow: 0 6px 18px rgba(0,0,0,.35) !important;
  }

  /* Keep Add/Edit Card modals fully inside the visible mobile viewport. */
  .modal{
    left: 8px !important;
    right: 8px !important;
    top: calc(8px + env(safe-area-inset-top, 0px)) !important;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
    height: auto !important;
    transform: none !important;
    overflow: hidden !important;
  }
  .modal.open{
    display: flex !important;
    flex-direction: column !important;
  }
  .modal header,
  .modal .modal-footer{
    flex: 0 0 auto !important;
  }
  .modal .modal-body{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
  }
  .modal .modal-footer{
    position: relative !important;
    z-index: 2 !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    background: linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%) !important;
  }

  .ccc-mobile-pager{
    grid-column: 1 / -1;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 10px 0 2px;
  }
  .ccc-mobile-pager-btn{
    appearance: none;
    -webkit-appearance: none;
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--panel);
    color: var(--text);
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
  }
  .ccc-mobile-pager-btn:disabled{
    opacity: .38;
    cursor: default;
  }
  .ccc-mobile-pager-label{
    min-width: 92px;
    text-align: center;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
  }
}

/* === SOURCE: 171-ccc-set-overview-dots-under-stats-v17.css === */
/* v17: keep the same dot/button size, but place the controls directly below
   the Subsets / Total Cards / Most Used Issue stats row and above the
   scrollable Subsets/Owners window. */
.ccc-set-overview-expand > .ccc-set-overview-dots{
  grid-column:1 / -1 !important;
  order:1 !important;
  margin:2px 0 7px !important;
  padding:3px 0 1px !important;
}
.ccc-set-overview-expand > .ccc-set-overview-slider{
  order:2 !important;
}
@media (max-width:620px){
  .ccc-set-overview-expand > .ccc-set-overview-dots{
    margin:1px 0 7px !important;
    padding:4px 0 1px !important;
  }
}

/* === SOURCE: 172-ccc-set-overview-button-refresh-v18.css === */
/* Give the two scroll panels their own button language while preserving the current size/layout. */
.ccc-set-overview-section--subsets .ccc-set-overview-pill--button,
.ccc-set-overview-section--owners .ccc-set-overview-owner-link{
  position:relative !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  min-height:28px !important;
  padding:6px 9px !important;
  border-radius:12px !important;
  text-transform:none !important;
  letter-spacing:.015em !important;
  font-size:11px !important;
  font-weight:850 !important;
  line-height:1.15 !important;
  box-shadow:0 5px 14px rgba(0,0,0,.16), inset 0 0 0 1px rgba(255,255,255,.035) !important;
  transition:border-color .16s ease, background .16s ease, transform .16s ease, box-shadow .16s ease !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pill--button{
  border-color:rgba(154,139,255,.42) !important;
  background:linear-gradient(180deg, rgba(154,139,255,.20), rgba(154,139,255,.08)) !important;
  color:#f1eeff !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pill--button::before{
  content:'view_list';
  font-family:'Material Symbols Outlined';
  font-size:14px;
  line-height:1;
  font-weight:400;
  color:rgba(222,216,255,.95);
  font-variation-settings:'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 20;
}
.ccc-set-overview-section--owners .ccc-set-overview-owner-link{
  border-color:rgba(86,219,190,.38) !important;
  background:linear-gradient(180deg, rgba(86,219,190,.17), rgba(86,219,190,.065)) !important;
  color:#eafff9 !important;
  border-radius:999px !important;
}
.ccc-set-overview-section--owners .ccc-set-overview-owner-link::before{
  content:'person';
  font-family:'Material Symbols Outlined';
  font-size:14px;
  line-height:1;
  font-weight:400;
  color:rgba(178,255,237,.95);
  font-variation-settings:'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 20;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pill--button:hover,
.ccc-set-overview-section--subsets .ccc-set-overview-pill--button:focus-visible{
  border-color:rgba(190,181,255,.82) !important;
  background:linear-gradient(180deg, rgba(154,139,255,.30), rgba(154,139,255,.13)) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.22), 0 0 0 1px rgba(154,139,255,.20) inset !important;
  transform:translateY(-1px) !important;
}
.ccc-set-overview-section--owners .ccc-set-overview-owner-link:hover,
.ccc-set-overview-section--owners .ccc-set-overview-owner-link:focus-visible{
  border-color:rgba(134,255,226,.72) !important;
  background:linear-gradient(180deg, rgba(86,219,190,.25), rgba(86,219,190,.11)) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.22), 0 0 0 1px rgba(86,219,190,.18) inset !important;
  transform:translateY(-1px) !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pill--button:active,
.ccc-set-overview-section--owners .ccc-set-overview-owner-link:active{
  transform:translateY(0) scale(.985) !important;
}
@media (max-width:620px){
  .ccc-set-overview-section--subsets .ccc-set-overview-pill--button,
  .ccc-set-overview-section--owners .ccc-set-overview-owner-link{
    min-height:30px !important;
    padding:6px 8px !important;
    font-size:10px !important;
    gap:4px !important;
  }
  .ccc-set-overview-section--subsets .ccc-set-overview-pill--button::before,
  .ccc-set-overview-section--owners .ccc-set-overview-owner-link::before{
    font-size:13px !important;
  }
}

/* === SOURCE: 173-ccc-mobile-scroll-top-v18.css === */
.ccc-mobile-scroll-top{
  display:none;
}
@media (max-width:780px){
  .ccc-mobile-scroll-top{
    position:fixed;
    right:14px;
    bottom:calc(18px + env(safe-area-inset-bottom, 0px));
    z-index:96;
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;
    padding:0;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.24);
    background:rgba(16,17,20,.78);
    color:#fff;
    box-shadow:0 12px 32px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.045);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    align-items:center;
    justify-content:center;
    opacity:0;
    pointer-events:none;
    transform:translateY(12px) scale(.96);
    transition:opacity .18s ease, transform .18s ease, border-color .18s ease, background .18s ease;
  }
  .ccc-mobile-scroll-top.is-visible{
    display:inline-flex;
    opacity:1;
    pointer-events:auto;
    transform:translateY(0) scale(1);
  }
  .ccc-mobile-scroll-top .material-symbols-outlined{
    font-size:25px;
    line-height:1;
  }
  .ccc-mobile-scroll-top:active{
    transform:translateY(1px) scale(.96);
    background:rgba(255,255,255,.13);
    border-color:rgba(255,255,255,.44);
  }
}


@media (min-width:781px){
  body.database-page-open .ccc-mobile-scroll-top{
    position:fixed;
    right:22px;
    bottom:22px;
    z-index:96;
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;
    padding:0;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.24);
    background:rgba(16,17,20,.78);
    color:#fff;
    box-shadow:0 12px 32px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.045);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    align-items:center;
    justify-content:center;
    opacity:0;
    pointer-events:none;
    transform:translateY(12px) scale(.96);
    transition:opacity .18s ease, transform .18s ease, border-color .18s ease, background .18s ease;
  }
  body.database-page-open .ccc-mobile-scroll-top.is-visible{
    display:inline-flex;
    opacity:1;
    pointer-events:auto;
    transform:translateY(0) scale(1);
  }
  body.database-page-open .ccc-mobile-scroll-top .material-symbols-outlined{
    font-size:25px;
    line-height:1;
  }
}

/* === SOURCE: 174-ccc-set-overview-horizontal-button-scroll-v19.css === */
/* Keep each scroll panel to one button row and let the row scroll sideways. */
.ccc-set-overview-section--subsets,
.ccc-set-overview-section--owners{
  overflow-y:hidden !important;
  overflow-x:hidden !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pillrow,
.ccc-set-overview-section--owners .ccc-set-overview-pillrow{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  gap:8px !important;
  width:100% !important;
  max-width:100% !important;
  max-height:none !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  padding:2px 2px 8px !important;
  scrollbar-width:thin !important;
  -webkit-overflow-scrolling:touch !important;
  overscroll-behavior-x:contain !important;
  overscroll-behavior-y:none !important;
  touch-action:pan-x !important;
  scroll-snap-type:x proximity !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pill,
.ccc-set-overview-section--owners .ccc-set-overview-pill,
.ccc-set-overview-section--subsets .ccc-set-overview-pill--button,
.ccc-set-overview-section--owners .ccc-set-overview-owner-link{
  flex:0 0 auto !important;
  width:auto !important;
  max-width:none !important;
  white-space:nowrap !important;
  overflow:visible !important;
  text-overflow:clip !important;
  scroll-snap-align:start !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pillrow::-webkit-scrollbar,
.ccc-set-overview-section--owners .ccc-set-overview-pillrow::-webkit-scrollbar{
  height:7px !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pillrow::-webkit-scrollbar-thumb,
.ccc-set-overview-section--owners .ccc-set-overview-pillrow::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.26) !important;
  border-radius:999px !important;
}
.ccc-set-overview-section--subsets .ccc-set-overview-pillrow::-webkit-scrollbar-track,
.ccc-set-overview-section--owners .ccc-set-overview-pillrow::-webkit-scrollbar-track{
  background:rgba(255,255,255,.055) !important;
  border-radius:999px !important;
}
@media (max-width:620px){
  .ccc-set-overview-section--subsets .ccc-set-overview-pillrow,
  .ccc-set-overview-section--owners .ccc-set-overview-pillrow{
    gap:7px !important;
    padding-bottom:9px !important;
  }
}

/* === SOURCE: 175-ccc-mobile-long-set-name-shrink-fix.css === */
/* Mobile fix: long set names from Browse List should not push the page off screen.
   Keep the set name on one line, but shrink it until it fits. */
@media (max-width: 780px){
  html,
  body{
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  .ccc-set-overview-wrap,
  .ccc-set-overview-card,
  .ccc-set-overview-card .mc-profile-row,
  .ccc-set-overview-card .mc-profile-left{
    min-width:0 !important;
    max-width:100% !important;
  }

  .ccc-set-overview-card .mc-profile-row{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    width:100% !important;
  }

  .ccc-set-overview-card .mc-profile-left{
    flex:1 1 auto !important;
    overflow:hidden !important;
  }

  .ccc-set-overview-card .mc-cuts-pill{
    flex:0 0 auto !important;
  }

  .ccc-set-overview-card .mc-profile-name{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    white-space:nowrap !important;
    overflow:visible !important;
    text-overflow:clip !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    line-height:1.05 !important;
    letter-spacing:0 !important;
    transform-origin:left center !important;
  }
}

/* === SOURCE: 176-fausto-mobile-full-details-no-jump-v21.css === */
@media (max-width:780px), (hover:none) and (pointer:coarse){
  /* Quick View had no card-shell padding; Full Details now uses the same outer placement so the card does not shift down/right. */
  #result > .card:not(.ccc-mobile-lite-card){
    padding:0 !important;
  }
  #result > .card:not(.ccc-mobile-lite-card) > .thumb{
    justify-self:center !important;
  }
}

/* === SOURCE: 177-ccc-issue-header-set-style-collapsed-fix.css === */
/* Comic book issue overview uses the same collapsed set-overview header behavior.
   The detail area opens only when the visible header row is tapped. */
.ccc-issue-series-overview-wrap{
  width:100% !important;
  display:flex !important;
  justify-content:center !important;
  margin:6px 0 10px !important;
}
.ccc-issue-series-overview-card{
  width:min(520px, 100%) !important;
}
.ccc-issue-series-overview-card .mc-profile-sub{
  white-space:normal;
  overflow-wrap:anywhere;
}
.ccc-issue-series-overview-card .ccc-issue-series-overview-expand{
  width:100% !important;
  min-width:0 !important;
}
.ccc-issue-series-overview-card[data-expanded="false"] .ccc-issue-series-overview-expand,
.ccc-issue-series-overview-card[aria-expanded="false"] .ccc-issue-series-overview-expand{
  display:none !important;
  max-height:0 !important;
  overflow:hidden !important;
  padding-top:0 !important;
  border-top:0 !important;
}
.ccc-issue-series-overview-card[data-expanded="true"] .ccc-issue-series-overview-expand,
.ccc-issue-series-overview-card[aria-expanded="true"] .ccc-issue-series-overview-expand{
  display:grid !important;
  gap:10px !important;
  max-height:none !important;
  overflow:visible !important;
  padding-top:8px !important;
  border-top:1px solid rgba(255,255,255,.12) !important;
}
.ccc-issue-series-overview-card .ccc-issue-series-overview-grid{
  display:grid !important;
  grid-template-columns:minmax(54px,.58fr) minmax(82px,.82fr) minmax(72px,.70fr) minmax(0,1.55fr) !important;
  gap:8px !important;
  align-items:stretch !important;
  width:100% !important;
  min-width:0 !important;
}
.ccc-issue-series-overview-card .ccc-issue-series-overview-grid .ccc-set-overview-stat{
  min-width:0 !important;
  padding:7px 8px !important;
  gap:2px !important;
}
.ccc-issue-series-overview-card .ccc-issue-series-overview-grid .ccc-set-overview-stat label{
  font-size:9px !important;
  letter-spacing:.055em !important;
  white-space:nowrap !important;
}
.ccc-issue-series-overview-card .ccc-issue-series-overview-grid .ccc-set-overview-stat strong{
  font-size:13px !important;
  line-height:1.12 !important;
}
.ccc-issue-series-overview-card .ccc-issue-series-overview-grid .ccc-set-overview-stat:nth-child(4) strong{
  font-size:12px !important;
  display:block !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
/* Keep the four requested stats as the detail content; do not show a second unfinished Set Names section. */
.ccc-issue-series-overview-card .ccc-issue-series-overview-section--sets{
  display:none !important;
}
@media (max-width:620px){
  .ccc-issue-series-overview-card .mc-profile-row{ gap:8px !important; }
  .ccc-issue-series-overview-card .ccc-issue-series-overview-grid{
    grid-template-columns:minmax(36px,.50fr) minmax(60px,.78fr) minmax(56px,.68fr) minmax(0,1.38fr) !important;
    gap:4px !important;
  }
  .ccc-issue-series-overview-card .ccc-issue-series-overview-grid .ccc-set-overview-stat{ padding:5px 4px !important; }
  .ccc-issue-series-overview-card .ccc-issue-series-overview-grid .ccc-set-overview-stat label{
    font-size:7px !important;
    letter-spacing:.025em !important;
    white-space:normal !important;
    line-height:1.05 !important;
    text-align:center !important;
  }
  .ccc-issue-series-overview-card .ccc-issue-series-overview-grid .ccc-set-overview-stat strong{
    font-size:10px !important;
    line-height:1.08 !important;
    text-align:center !important;
  }
  .ccc-issue-series-overview-card .ccc-issue-series-overview-grid .ccc-set-overview-stat:nth-child(4) strong{
    font-size:9px !important;
    white-space:normal !important;
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    line-clamp:2 !important;
  }
}

/* === SOURCE: 178-ccc-final-mobile-overrides.css === */
@media (max-width:780px){
  .topbar{ background:#101114 !important; background-image:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; z-index:3000 !important; }
  .ccc-set-overview-grid,
  .ccc-issue-series-overview-grid{ grid-template-columns:minmax(38px,.55fr) minmax(54px,.7fr) minmax(52px,.7fr) minmax(0,1.55fr) !important; gap:5px !important; }
  .ccc-set-overview-stat{ grid-column:auto !important; padding:6px 5px !important; }
  .ccc-set-overview-stat label{ font-size:7px !important; letter-spacing:.035em !important; white-space:normal !important; line-height:1.05 !important; }
  .ccc-set-overview-stat strong{ font-size:10px !important; line-height:1.1 !important; }
  .ccc-set-overview-stat:nth-child(4) strong{ font-size:9px !important; line-height:1.08 !important; }
}

/* === SOURCE: 213-desktop-random-card-glass-panel.css === */
/* Desktop-only Random Card of the Day glass panel.
   Applies equally to logged-in members and logged-out guests.
   Mobile remains unchanged. */
@media (min-width: 781px){
  /* Add clearer separation from the Pro Tip slider above. */
  #randomCardDayWrap.random-card-day-wrap,
  .random-card-day-wrap{
    margin-top: 52px !important;
  }

  /* Shared member + guest glass treatment. */
  #randomCardDay .random-card-day-btn,
  .random-card-day-btn,
  .random-card-day-btn.is-guest-viewer{
    border: 1px solid rgba(255,255,255,.13) !important;
    background: rgba(18,18,28,.50) !important;
    box-shadow: 0 16px 42px rgba(0,0,0,.28) !important;
    -webkit-backdrop-filter: blur(16px) saturate(120%);
    backdrop-filter: blur(16px) saturate(120%);
  }

  #randomCardDay .random-card-day-btn:hover,
  .random-card-day-btn:hover,
  .random-card-day-btn.is-guest-viewer:hover{
    border-color: rgba(255,255,255,.20) !important;
    background: rgba(24,24,36,.56) !important;
  }

  /* Logged-out desktop mirrors the logged-in three-column presentation when
     both the cut image and imagecomic exist. */
  .random-card-day-btn.is-guest-viewer.has-dual-media{
    grid-template-columns: minmax(110px, 150px) minmax(0, 1fr) minmax(110px, 150px) !important;
    grid-template-areas: "cut copy comic" !important;
  }

  /* If a guest record only has imagecomic, keep the same centered member
     geometry: centered copy with imagecomic in the right-hand image slot. */
  .random-card-day-btn.is-guest-viewer:not(.has-dual-media){
    grid-template-columns: minmax(110px, 150px) minmax(0, 1fr) minmax(110px, 150px) !important;
    grid-template-areas: ". copy comic" !important;
    align-items: center !important;
  }

  .random-card-day-btn.is-guest-viewer .random-card-day-copy{
    grid-area: copy !important;
    width: 100%;
    place-self: center;
    text-align: center !important;
    justify-items: center !important;
    align-content: center !important;
  }

  .random-card-day-btn.is-guest-viewer .random-card-day-kicker{
    justify-content: center !important;
  }

  .random-card-day-btn.is-guest-viewer:not(.has-dual-media) .random-card-day-media{
    grid-area: comic !important;
    width: 100%;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  /* Both Random Card images are frameless; the glass panel itself keeps its
     subtle white border. imagecomic remains borderless as requested. */
  #randomCardDay .random-card-day-media.is-comic-only,
  .random-card-day-btn .random-card-day-media.is-comic-only{
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
  }

  #randomCardDay .random-card-day-comic,
  .random-card-day-btn .random-card-day-comic,
  #randomCardDay .random-card-day-cut,
  .random-card-day-btn .random-card-day-cut{
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  /* When the Random Card cut is the only image, the border comes from its
     shared media wrapper rather than the img itself. Remove that frame too. */
  #randomCardDay .random-card-day-media:not(.is-comic-only):has(.random-card-day-cut),
  .random-card-day-btn .random-card-day-media:not(.is-comic-only):has(.random-card-day-cut){
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
  }
}

/* === SOURCE: 179-mc-header-no-award-top-divider-v16.css === */
.mc-profile-awards::before{
  content:none !important;
  display:none !important;
  width:0 !important;
  height:0 !important;
  margin:0 !important;
  background:none !important;
}
.mc-profile-awards{
  padding-top:0 !important;
}

/* === SOURCE: 180-mc-header-single-awards-status-divider-v17.css === */
/* The visible divider should be the pseudo-line above On the Hunt / Trade-Sale / PC only. */
.mc-status-summary.mc-status-summary--inline{
  border-top:0 !important;
  padding-top:0 !important;
}
.mc-status-summary.mc-status-summary--inline::before{
  display:block !important;
  content:'' !important;
  margin-top:0 !important;
  margin-bottom:8px !important;
}

/* === SOURCE: 181-mc-header-single-progress-most-divider-v18.css === */
/* The visible divider below the progress bar should be the Most Collected separator only. */
.mc-profile-expand > .mc-progress-btn,
.mc-profile-expand > .mc-progress-btn .mc-progress-row{
  border-bottom:0 !important;
  box-shadow:none !important;
  padding-bottom:0 !important;
  margin-bottom:0 !important;
}
.mc-profile-expand > .mc-progress-btn::after,
.mc-profile-expand > .mc-progress-btn .mc-progress-row::after{
  content:none !important;
  display:none !important;
}
.mc-most-collected-grid--compact{
  border-top:0 !important;
  padding-top:0 !important;
  margin-top:6px !important;
}
.mc-most-collected-grid--compact::before{
  display:block !important;
  content:'' !important;
  margin-top:0 !important;
  margin-bottom:8px !important;
}
.mc-profile-card--no-progress .mc-most-collected-grid--compact{
  margin-top:6px !important;
}

/* === SOURCE: 182-mc-header-visual-stats-side-by-side-v25.css === */
.mc-header-visual-stats{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:10px !important;
  align-items:stretch !important;
}
.mc-header-visual-stat{
  min-width:0 !important;
  max-width:100% !important;
  grid-template-columns:44px minmax(0, 1fr) !important;
  gap:8px !important;
  align-items:center !important;
}
.mc-header-visual-stat-copy{
  min-width:0 !important;
}
.mc-header-visual-stat-copy b,
.mc-header-visual-stat-copy span,
.mc-header-visual-stat-copy small{
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
@media (max-width:520px){
  .mc-header-visual-stats{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:8px !important;
  }
  .mc-header-visual-stat{
    grid-template-columns:36px minmax(0, 1fr) !important;
    gap:6px !important;
  }
  .mc-header-visual-stat-media{
    width:36px !important;
  }
  .mc-header-visual-stat-copy{
    gap:2px !important;
  }
  .mc-header-visual-stat-copy b{
    font-size:9px !important;
    letter-spacing:.07em !important;
  }
  .mc-header-visual-stat-copy span{
    font-size:11px !important;
    line-height:1.12 !important;
  }
  .mc-header-visual-stat-copy small{
    font-size:9px !important;
    line-height:1.12 !important;
  }
}

/* === SOURCE: 183-mc-header-visual-stats-row-align-v26.css === */
.mc-header-visual-stats{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:8px 12px !important;
  align-items:start !important;
}
.mc-header-visual-stats::before,
.mc-most-collected-grid--compact.mc-header-visual-stats::before{
  grid-column:1 / -1 !important;
  grid-row:auto !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 0 8px 0 !important;
  justify-self:stretch !important;
}
.mc-header-visual-stat{
  align-self:start !important;
  min-width:0 !important;
  max-width:100% !important;
  display:grid !important;
  grid-template-columns:44px minmax(0, 1fr) !important;
  align-items:center !important;
  gap:8px !important;
}
.mc-header-visual-stat:first-of-type{ grid-column:1 !important; }
.mc-header-visual-stat:nth-of-type(2){ grid-column:2 !important; }
@media (max-width:520px){
  .mc-header-visual-stats{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:7px 8px !important;
  }
  .mc-header-visual-stat{
    grid-template-columns:34px minmax(0, 1fr) !important;
    gap:6px !important;
  }
  .mc-header-visual-stat-media{
    width:34px !important;
  }
  .mc-header-visual-stat-copy b{
    font-size:8.5px !important;
    letter-spacing:.055em !important;
  }
  .mc-header-visual-stat-copy span{
    font-size:10.5px !important;
    line-height:1.1 !important;
  }
  .mc-header-visual-stat-copy small{
    font-size:8.5px !important;
    line-height:1.1 !important;
  }
}

/* === SOURCE: 184-mc-header-center-info-rows-v27.css === */
.mc-status-summary.mc-status-summary--inline{
  width:fit-content !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  justify-content:center !important;
  text-align:center !important;
}
.mc-profile-expand > .mc-progress-btn{
  width:min(58%, 430px) !important;
  max-width:430px !important;
  min-width:260px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.mc-profile-expand > .mc-progress-btn .mc-progress-row{
  width:100% !important;
  justify-content:center !important;
}
.mc-header-visual-stats,
.mc-most-collected-grid--compact.mc-header-visual-stats{
  width:100% !important;
  max-width:540px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  grid-template-columns:repeat(2, minmax(0, 220px)) !important;
  justify-content:center !important;
  justify-items:center !important;
  align-items:start !important;
}
.mc-header-visual-stats::before,
.mc-most-collected-grid--compact.mc-header-visual-stats::before{
  justify-self:stretch !important;
  width:100% !important;
  max-width:100% !important;
}
.mc-header-visual-stat{
  width:100% !important;
  max-width:220px !important;
  justify-self:center !important;
}
@media (max-width:620px){
  .mc-status-summary.mc-status-summary--inline{
    width:fit-content !important;
    max-width:100% !important;
    overflow:visible !important;
  }
  .mc-profile-expand > .mc-progress-btn{
    width:min(78%, 330px) !important;
    min-width:230px !important;
    max-width:330px !important;
  }
  .mc-header-visual-stats,
  .mc-most-collected-grid--compact.mc-header-visual-stats{
    max-width:100% !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:7px 8px !important;
    justify-content:center !important;
    justify-items:center !important;
  }
  .mc-header-visual-stat{
    max-width:170px !important;
  }
}
@media (max-width:420px){
  .mc-status-summary--inline .mc-status-summary-row{
    padding-left:5px !important;
    padding-right:5px !important;
  }
  .mc-profile-expand > .mc-progress-btn{
    width:min(82%, 300px) !important;
    min-width:215px !important;
  }
  .mc-header-visual-stat{
    max-width:155px !important;
  }
}

/* === SOURCE: 185-mc-header-progress-label-v29.css === */
.mc-profile-expand > .mc-progress-btn{
  width:min(74%, 560px) !important;
  max-width:560px !important;
  min-width:320px !important;
}
.mc-profile-expand > .mc-progress-btn .mc-progress-row{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
  flex-wrap:nowrap !important;
}
.mc-progress-label{
  flex:0 0 auto !important;
  color:rgba(255,255,255,.72) !important;
  font-size:11px !important;
  font-weight:900 !important;
  letter-spacing:.065em !important;
  line-height:1 !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
}
.mc-profile-expand > .mc-progress-btn .mc-progress-track{
  flex:1 1 220px !important;
  min-width:110px !important;
}
.mc-profile-expand > .mc-progress-btn .mc-progress-pctwrap{
  flex:0 0 auto !important;
}
@media (max-width:620px){
  .mc-profile-expand > .mc-progress-btn{
    width:100% !important;
    max-width:360px !important;
    min-width:0 !important;
  }
  .mc-profile-expand > .mc-progress-btn .mc-progress-row{
    gap:7px !important;
  }
  .mc-progress-label{
    font-size:9px !important;
    letter-spacing:.045em !important;
  }
  .mc-profile-expand > .mc-progress-btn .mc-progress-track{
    flex:1 1 auto !important;
    min-width:72px !important;
  }
  .mc-progress-pct{
    min-width:30px !important;
    font-size:10px !important;
  }
  .mc-progress-edit{
    display:none !important;
  }
}
@media (max-width:390px){
  .mc-profile-expand > .mc-progress-btn{
    max-width:330px !important;
  }
  .mc-profile-expand > .mc-progress-btn .mc-progress-row{
    gap:6px !important;
  }
  .mc-progress-label{
    font-size:8px !important;
    letter-spacing:.035em !important;
  }
  .mc-profile-expand > .mc-progress-btn .mc-progress-track{
    min-width:54px !important;
  }
  .mc-progress-pct{
    min-width:28px !important;
    font-size:9px !important;
  }
}

/* === SOURCE: 186-mc-header-status-no-dividers-v31.css === */
.mc-status-summary.mc-status-summary--inline{
  border-top:0 !important;
  border-bottom:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.mc-status-summary.mc-status-summary--inline::before,
.mc-status-summary.mc-status-summary--inline::after{
  content:none !important;
  display:none !important;
  width:0 !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:none !important;
  box-shadow:none !important;
}
.mc-most-collected-grid--compact.mc-header-visual-stats::before,
.mc-header-visual-stats::before{
  content:none !important;
  display:none !important;
  width:0 !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:none !important;
  box-shadow:none !important;
}
.mc-most-collected-grid--compact.mc-header-visual-stats{
  padding-top:0 !important;
  border-top:0 !important;
}

/* === SOURCE: 187-mc-header-visual-stats-divider-v32.css === */
.mc-most-collected-grid--compact.mc-header-visual-stats{
  padding-top:8px !important;
  border-top:0 !important;
  margin-top:8px !important;
}
.mc-most-collected-grid--compact.mc-header-visual-stats::before,
.mc-header-visual-stats::before{
  content:'' !important;
  display:block !important;
  grid-column:1 / -1 !important;
  width:100% !important;
  height:1px !important;
  margin:0 0 8px 0 !important;
  padding:0 !important;
  border:0 !important;
  background:rgba(255,255,255,.14) !important;
  box-shadow:none !important;
  justify-self:stretch !important;
}

/* === SOURCE: 188-ccc-mobile-nonmaster-nav-lock-v2-style.css === */
@media (max-width:820px), (hover:none) and (pointer:coarse){
  html body #comicCutNav #setChecklistBtn[data-ccc-mobile-nonmaster-nav-lock="true"],
  html body #comicCutNav #backToSetBtn[data-ccc-mobile-nonmaster-nav-lock="true"],
  html body #comicCutNav #nextComicCutBtn[data-ccc-mobile-nonmaster-nav-lock="true"],
  html body .card .comic-cut-card-action-stack > #comicCutNav #setChecklistBtn[data-ccc-mobile-nonmaster-nav-lock="true"],
  html body .card .comic-cut-card-action-stack > #comicCutNav #backToSetBtn[data-ccc-mobile-nonmaster-nav-lock="true"],
  html body .card .comic-cut-card-action-stack > #comicCutNav #nextComicCutBtn[data-ccc-mobile-nonmaster-nav-lock="true"]{
    opacity:.30 !important;
    filter:grayscale(1) saturate(0) !important;
    cursor:not-allowed !important;
    pointer-events:none !important;
    background:rgba(80,80,86,.16) !important;
    border-color:rgba(160,160,170,.18) !important;
    border-bottom-color:rgba(160,160,170,.18) !important;
    color:rgba(170,174,184,.58) !important;
    box-shadow:none !important;
    transform:none !important;
  }
  html body #comicCutNav.ccc-mobile-nonmaster-nav-locked #setChecklistBtn[data-ccc-mobile-nonmaster-nav-lock="true"] .material-symbols-outlined,
  html body #comicCutNav.ccc-mobile-nonmaster-nav-locked #backToSetBtn[data-ccc-mobile-nonmaster-nav-lock="true"] .material-symbols-outlined,
  html body #comicCutNav.ccc-mobile-nonmaster-nav-locked #nextComicCutBtn[data-ccc-mobile-nonmaster-nav-lock="true"] .material-symbols-outlined{
    color:rgba(170,174,184,.58) !important;
  }
}

/* === SOURCE: 189-fausto-requested-ui-fixes-v20.css === */
/* Set View: make Comic Books / Checklist match the My Collection text-underlined tabs. */
.view-toggle-row{
  justify-content:center !important;
  gap:18px !important;
  margin:8px 0 12px !important;
  padding:0 8px !important;
}
.view-toggle-btn{
  appearance:none !important;
  border:none !important;
  border-bottom:1px solid rgba(255,255,255,0.10) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:var(--text) !important;
  padding:0 6px 8px !important;
  min-height:0 !important;
  font-size:14px !important;
  font-weight:400 !important;
  letter-spacing:.01em !important;
  text-transform:none !important;
  gap:0 !important;
  transition:border-bottom-color .18s ease, opacity .18s ease !important;
}
.view-toggle-btn .material-symbols-outlined{
  display:none !important;
}
@media (hover: hover) and (pointer: fine){
.view-toggle-btn:hover{
  background:transparent !important;
  border-color:transparent !important;
  border-bottom-color:#ffffff !important;
  transform:none !important;
  outline:none !important;
}
}
.view-toggle-btn:focus-visible{
  background:transparent !important;
  border-color:transparent !important;
  border-bottom-color:#ffffff !important;
  transform:none !important;
  outline:none !important;
}
.view-toggle-btn[aria-pressed="true"]{
  background:transparent !important;
  border-color:transparent !important;
  border-bottom-color:#ffffff !important;
  color:var(--text) !important;
  opacity:1 !important;
}
@media (max-width:780px){
  .view-toggle-row{
    justify-content:center !important;
    flex-wrap:nowrap !important;
  }
  .view-toggle-btn{
    flex:0 0 auto !important;
    justify-content:center !important;
  }
}

/* Add the existing mobile back-to-top arrow behavior to desktop too. */
@media (min-width:781px){
  .ccc-mobile-scroll-top{
    position:fixed !important;
    right:18px !important;
    bottom:calc(72px + env(safe-area-inset-bottom, 0px)) !important;
    z-index:96 !important;
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    min-height:44px !important;
    padding:0 !important;
    border-radius:999px !important;
    border:1px solid rgba(255,255,255,.24) !important;
    background:rgba(16,17,20,.78) !important;
    color:#fff !important;
    box-shadow:0 12px 32px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.045) !important;
    backdrop-filter:blur(12px) !important;
    -webkit-backdrop-filter:blur(12px) !important;
    align-items:center !important;
    justify-content:center !important;
    opacity:0 !important;
    pointer-events:none !important;
    transform:translateY(12px) scale(.96) !important;
    transition:opacity .18s ease, transform .18s ease, border-color .18s ease, background .18s ease !important;
  }
  .ccc-mobile-scroll-top.is-visible{
    display:inline-flex !important;
    opacity:1 !important;
    pointer-events:auto !important;
    transform:translateY(0) scale(1) !important;
  }
  @media (hover: hover) and (pointer: fine){
  .ccc-mobile-scroll-top:hover{
    background:rgba(255,255,255,.13) !important;
    border-color:rgba(255,255,255,.44) !important;
  }
  }
}

/* The mobile topbar is viewport-fixed; keep anchor targets below it. */
@media (max-width:780px), (hover:none) and (pointer:coarse){
  #result,
  #result > .card,
  .mini-subset-header,
  .comic-cuts-row,
  .ccc-checklist-highlight,
  .ccc-set-overview-card,
  .ccc-set-overview-title,
  .ccc-set-overview-hero{
    scroll-margin-top:calc(var(--topbar-h, 56px) + 14px) !important;
  }
}

/* === SOURCE: 190-ccc-set-header-desktop-one-row-v19.css === */
/* Desktop only: the normal Set overview header has 4 stats
   (Sets / Signature / Total Cards / Most Used Issue). Older desktop rules
   forced .ccc-set-overview-grid to 3 columns, so the 4th stat wrapped.
   Mobile rules are left untouched because they already work. */
@media (min-width:781px){
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid{
    display:grid !important;
    grid-template-columns:minmax(58px,.55fr) minmax(78px,.75fr) minmax(74px,.70fr) minmax(0,1.55fr) !important;
    gap:8px !important;
    align-items:stretch !important;
    width:100% !important;
    min-width:0 !important;
  }
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid .ccc-set-overview-stat{
    grid-column:auto !important;
    min-width:0 !important;
  }
  .ccc-set-overview-card:not(.ccc-issue-series-overview-card) .ccc-set-overview-grid .ccc-set-overview-stat:nth-child(4) strong{
    font-size:12px !important;
    line-height:1.08 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }
}

/* === SOURCE: 191-fausto-mobile-popup-and-set-checklist-bookmark.css === */
/* Mobile 1CC Social Club popup top clipping fix + Set Checklist layout */
@media (max-width: 780px){
  html body #protipPopupOverlay.protip-popup-overlay.is-1cc-social-club-popup,
  html body #protipPopupOverlay.protip-popup-overlay.open.is-1cc-social-club-popup{
    position:fixed !important;
    inset:0 !important;
    width:100vw !important;
    height:100vh !important;
    height:100dvh !important;
    z-index:2147483640 !important;
    align-items:flex-start !important;
    justify-content:center !important;
    box-sizing:border-box !important;
    padding-top:calc(max(12px, env(safe-area-inset-top)) + 8px) !important;
    padding-right:max(12px, env(safe-area-inset-right)) !important;
    padding-bottom:max(12px, env(safe-area-inset-bottom)) !important;
    padding-left:max(12px, env(safe-area-inset-left)) !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    -webkit-overflow-scrolling:touch !important;
  }

  html body #protipPopupOverlay.is-1cc-social-club-popup #protipPopup.protip-popup{
    width:calc(100vw - max(24px, env(safe-area-inset-left) + env(safe-area-inset-right) + 24px)) !important;
    max-width:920px !important;
    max-height:calc(100dvh - max(12px, env(safe-area-inset-top)) - max(12px, env(safe-area-inset-bottom)) - 16px) !important;
    margin:0 auto !important;
    position:relative !important;
    z-index:2147483641 !important;
    overflow:hidden !important;
  }

  html body #protipPopupOverlay.is-1cc-social-club-popup #protipPopup .protip-popup-header{
    flex:0 0 auto !important;
  }

  html body #protipPopupOverlay.is-1cc-social-club-popup #protipPopup .protip-popup-body{
    min-height:0 !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }
}


/* Set Checklist columns and Price Guide-style rows-only scrolling. */
.set-checklist-list.set-checklist-list--logged-in .comic-cuts-head,
.set-checklist-list.set-checklist-list--logged-in .comic-cuts-row,
.set-checklist-global-head--logged-in{
  grid-template-columns:minmax(0,2.6fr) minmax(84px,.9fr) minmax(84px,.9fr) repeat(2, minmax(72px,.75fr));
}

.set-checklist-list.set-checklist-list--logged-out .comic-cuts-head,
.set-checklist-list.set-checklist-list--logged-out .comic-cuts-row,
.set-checklist-global-head--logged-out{
  grid-template-columns:minmax(0,2.6fr) minmax(84px,.9fr) minmax(84px,.9fr) !important;
}

/* Desktop: Checklist column headings read from the left edge of each column. */
.set-checklist-list .comic-cuts-head > div,
.set-checklist-global-head > div{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  justify-self:stretch;
  text-align:left;
}

.set-checklist-global-head{
  width:100%;
  box-sizing:border-box;
  margin-top:10px;
  flex:0 0 auto;
}

/* Comic Books uses this only on phones to reserve the exact same header-row
   height as Checklist. Keeping one shared structural slot prevents the Subset
   heading from jumping when switching between the two tabs. */
.set-checklist-global-head-spacer{
  display:none !important;
}

.set-checklist-list--logged-in .comic-cuts-head-icon,
.set-checklist-global-head--logged-in .comic-cuts-head-icon{
  display:flex;
  align-items:center;
  justify-content:flex-start;
}

.set-checklist-list--logged-in .comic-cuts-head-icon .material-symbols-outlined,
.set-checklist-global-head--logged-in .comic-cuts-head-icon .material-symbols-outlined{
  font-size:18px;
  line-height:1;
  color:var(--muted);
}

/* Match the standalone Price Guide: the set overview, view buttons, and column
   labels stay together. Only the rows below the column header scroll. */
html.set-checklist-scroll-active,
body.set-checklist-scroll-active{
  overflow-y:hidden !important;
  overscroll-behavior-y:none !important;
}

body.set-checklist-scroll-active #result{
  width:100% !important;
  min-height:0 !important;
  max-height:none !important;
  padding-bottom:0 !important;
  overflow:hidden !important;
}

.set-checklist-scroll-shell{
  width:100%;
  max-width:100%;
  min-width:0;
  min-height:0;
  margin:0;
  padding:0;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.set-checklist-scroll-shell > .view-toggle-row,
.set-checklist-scroll-shell > .set-checklist-global-head{
  flex:0 0 auto;
}

.set-checklist-rows-scroll{
  flex:1 1 auto;
  min-height:0;
  width:100%;
  max-width:100%;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  touch-action:pan-y;
  scrollbar-gutter:stable;
  padding-bottom:16px;
  box-sizing:border-box;
}

.set-checklist-subset-section{
  width:100%;
  min-width:0;
}

/* The page owns one column header, so each Subset begins directly under its
   divider instead of repeating Card Name / #SN / #CN / ownership headings. */
.set-checklist-subset-section > .set-checklist-list{
  margin-top:0;
}

/* Subset dividers live inside the rows viewport. Keep the active Subset in the
   same visual position it starts in instead of letting it travel upward before
   sticking. The solid page-black surface removes the purple fill and the small
   mask above the header prevents scrolling row text from showing through the
   intentional gap beneath the column-header divider. */
.set-checklist-subset-header{
  position:sticky !important;
  top:8px !important;
  z-index:3 !important;
  box-sizing:border-box !important;
  background:#000 !important;
}

.set-checklist-subset-header::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-8px;
  height:8px;
  background:#000;
  pointer-events:none;
}

@media (max-width: 780px){
  .set-checklist-global-head-spacer{
    display:grid !important;
    visibility:hidden !important;
    pointer-events:none !important;
    user-select:none !important;
  }

  /* Set-page Subset labels should read like the card names below them on mobile,
     while keeping the chevron and expand/collapse behavior unchanged. */
  .set-view-subset-header{
    font-size:11px !important;
    font-weight:600 !important;
  }

  .set-checklist-list.set-checklist-list--logged-in .comic-cuts-head,
  .set-checklist-list.set-checklist-list--logged-in .comic-cuts-row,
  .set-checklist-global-head--logged-in{
    grid-template-columns:minmax(0,1.9fr) minmax(44px,.52fr) minmax(50px,.56fr) repeat(2, minmax(34px,.38fr));
  }

  .set-checklist-list.set-checklist-list--logged-out .comic-cuts-head,
  .set-checklist-list.set-checklist-list--logged-out .comic-cuts-row,
  .set-checklist-global-head--logged-out{
    grid-template-columns:minmax(0,1.9fr) minmax(48px,.52fr) minmax(58px,.58fr) !important;
  }

  /* Mobile: Card Name stays left-aligned; every other heading remains centered. */
  .set-checklist-list .comic-cuts-head > div:first-child,
  .set-checklist-global-head > div:first-child{
    justify-content:flex-start !important;
    text-align:left !important;
  }
  .set-checklist-list .comic-cuts-head > div:not(:first-child),
  .set-checklist-global-head > div:not(:first-child),
  .set-checklist-list--logged-in .comic-cuts-head-icon,
  .set-checklist-global-head--logged-in .comic-cuts-head-icon{
    justify-content:center !important;
    text-align:center !important;
  }

  .set-checklist-list--logged-in .comic-cuts-head-icon .material-symbols-outlined,
  .set-checklist-global-head--logged-in .comic-cuts-head-icon .material-symbols-outlined{
    font-size:16px;
  }

  body.set-checklist-scroll-active #result{
    padding-bottom:0 !important;
    overflow:hidden !important;
  }

  .set-checklist-rows-scroll{
    overflow-y:auto !important;
    overflow-x:hidden !important;
    padding-bottom:10px;
  }
}

/* Mobile Set Checklist -> Full Details transition. The selected issue/cut is
   acknowledged immediately, then this loader remains only while the real Full
   Details view and its first main image are becoming ready. Desktop is untouched. */
@media (max-width: 780px){
  .mini-row.ccc-mobile-card-opening-source,
  .comic-cuts-row.ccc-mobile-card-opening-source{
    box-shadow:inset 0 0 0 2px #fff !important;
    filter:brightness(1.08);
  }

  .ccc-mobile-full-details-open-loader{
    position:fixed;
    inset:0;
    z-index:2147483300;
    display:flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    padding:24px;
    background:rgba(0,0,0,.82);
    pointer-events:auto;
  }

  .ccc-mobile-full-details-open-loader[hidden]{
    display:none !important;
  }

  .ccc-mobile-full-details-open-loader-card{
    width:min(300px, calc(100vw - 48px));
    min-height:118px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    box-sizing:border-box;
    padding:20px 22px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:14px;
    background:#101114;
    color:#fff;
    text-align:center;
  }

  .ccc-mobile-full-details-open-loader-card strong{
    font-size:15px;
    line-height:1.25;
    font-weight:700;
  }

  .ccc-mobile-full-details-open-loader-issue{
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:var(--muted);
    font-size:12px;
    line-height:1.25;
  }

  .ccc-mobile-full-details-open-loader-icon{
    font-size:26px;
    line-height:1;
    animation:ccc-mobile-set-card-open-spin .85s linear infinite;
  }

  @keyframes ccc-mobile-set-card-open-spin{
    to{ transform:rotate(360deg); }
  }

  @media (prefers-reduced-motion: reduce){
    .ccc-mobile-full-details-open-loader-icon{ animation:none; }
  }
}

/* === SOURCE: 192-mobile-popups-below-topbar-fix.css === */
/* Patch v23: mobile popup/modal topbar clearance
   Keep every app popup below the fixed mobile topbar instead of letting popup
   headers sit underneath the left/right flyout button bar. This intentionally
   targets the shared popup families rather than only one popup instance. */
@media (max-width: 780px){
  :root{
    --ccc-mobile-popup-gap: 10px;
    --ccc-mobile-popup-top: calc(var(--topbar-h, 56px) + max(var(--ccc-mobile-popup-gap), env(safe-area-inset-top, 0px)));
    --ccc-mobile-popup-bottom: calc(max(var(--ccc-mobile-popup-gap), env(safe-area-inset-bottom, 0px)));
    --ccc-mobile-popup-side: max(10px, env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
  }

  /* The dimmed layer starts under the topbar so the two flyout buttons never sit
     on top of dimmed/popup content. */
  .modal-overlay,
  .protip-popup-overlay,
  .ccc-gallery-overlay,
  html body #protipPopupOverlay.protip-popup-overlay,
  html body #protipPopupOverlay.protip-popup-overlay.open,
  html body #protipPopupOverlay.protip-popup-overlay.is-1cc-social-club-popup,
  html body #protipPopupOverlay.protip-popup-overlay.open.is-1cc-social-club-popup{
    position: fixed !important;
    top: var(--ccc-mobile-popup-top) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    inset: var(--ccc-mobile-popup-top) 0 0 0 !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    box-sizing: border-box !important;
    z-index: 2400 !important;
  }

  .modal-overlay{
    z-index: 2000 !important;
  }

  /* Shared Add/Edit/Privacy modal panel placement. */
  .modal,
  #addCardModal,
  #editCardModal,
  #privacyModal{
    position: fixed !important;
    top: var(--ccc-mobile-popup-top) !important;
    right: var(--ccc-mobile-popup-side) !important;
    bottom: var(--ccc-mobile-popup-bottom) !important;
    left: var(--ccc-mobile-popup-side) !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    transform: none !important;
    overflow: hidden !important;
    z-index: 2100 !important;
  }

  .modal.open,
  #addCardModal.open,
  #editCardModal.open,
  #privacyModal.open{
    display: flex !important;
    flex-direction: column !important;
  }

  .modal header,
  .modal .modal-footer{
    flex: 0 0 auto !important;
  }

  .modal .modal-body{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
  }

  /* Shared Pro Tip / 1CC popup placement. Overrides the previous one-off 1CC
     z-index/top rules so this popup follows the same topbar clearance as every
     other popup. */
  .protip-popup-overlay,
  .ccc-gallery-overlay,
  html body #protipPopupOverlay.protip-popup-overlay,
  html body #protipPopupOverlay.protip-popup-overlay.open,
  html body #protipPopupOverlay.protip-popup-overlay.is-1cc-social-club-popup,
  html body #protipPopupOverlay.protip-popup-overlay.open.is-1cc-social-club-popup{
    align-items: flex-start !important;
    justify-content: center !important;
    padding-top: var(--ccc-mobile-popup-gap) !important;
    padding-right: var(--ccc-mobile-popup-side) !important;
    padding-bottom: var(--ccc-mobile-popup-bottom) !important;
    padding-left: var(--ccc-mobile-popup-side) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .protip-popup,
  html body #protipPopupOverlay #protipPopup.protip-popup,
  html body #protipPopupOverlay.is-1cc-social-club-popup #protipPopup.protip-popup{
    position: relative !important;
    width: 100% !important;
    max-width: 920px !important;
    max-height: calc(100dvh - var(--ccc-mobile-popup-top) - var(--ccc-mobile-popup-bottom) - (var(--ccc-mobile-popup-gap) * 2)) !important;
    margin: 0 auto !important;
    z-index: 2401 !important;
    overflow: hidden !important;
  }

  .protip-popup-header,
  .ccc-gallery-toolbar{
    flex: 0 0 auto !important;
  }

  .protip-popup-body{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* Fit-screen gallery is also a popup and should honor the same header gap. */
  .ccc-gallery-modal{
    width: 100% !important;
    max-width: 920px !important;
    max-height: calc(100dvh - var(--ccc-mobile-popup-top) - var(--ccc-mobile-popup-bottom) - (var(--ccc-mobile-popup-gap) * 2)) !important;
    margin: 0 auto !important;
    overflow: hidden !important;
  }

  .ccc-gallery-stage-wrap{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* === SOURCE: 193-mobile-left-flyout-match-desktop.css === */
/* Patch v24: make the mobile left flyout match the desktop left flyout.
   Later mobile overrides raise the fixed topbar above regular flyouts and
   remove the flyout shadow/backdrop. This restores the desktop-style left
   drawer behavior only on mobile: full-height, above the topbar, with the
   same panel background, border, shadow, and slide transition. */
@media (max-width:780px), (hover:none) and (pointer:coarse){
  #flyoutOverlay.flyout-overlay.open{
    position:fixed !important;
    inset:0 !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:0 !important;
    width:auto !important;
    height:auto !important;
    background:rgba(0,0,0,.45) !important;
    backdrop-filter:blur(2px) !important;
    -webkit-backdrop-filter:blur(2px) !important;
    opacity:1 !important;
    z-index:2147483000 !important;
  }

  #leftFlyout.flyout.left{
    position:fixed !important;
    top:0 !important;
    bottom:0 !important;
    left:0 !important;
    width:min(88vw, 380px) !important;
    max-width:380px !important;
    height:auto !important;
    min-height:0 !important;
    display:flex !important;
    flex-direction:column !important;
    background:linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%) !important;
    border:1px solid var(--border) !important;
    border-left:none !important;
    box-shadow:var(--shadow) !important;
    backdrop-filter:blur(2px) !important;
    -webkit-backdrop-filter:blur(2px) !important;
    opacity:1 !important;
    z-index:2147483002 !important;
    --start-x:-100%;
    transform:translateX(var(--start-x)) !important;
    transition:transform .25s ease !important;
  }

  #leftFlyout.flyout.left.open{
    transform:translateX(0) !important;
  }

  #leftFlyout.flyout.left header{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    padding:12px !important;
    border-bottom:1px solid var(--border) !important;
    flex:0 0 auto !important;
  }

  #leftFlyout.flyout.left .content{
    padding:12px !important;
    overflow:auto !important;
    -webkit-overflow-scrolling:touch !important;
    display:grid !important;
    gap:10px !important;
    font-size:14px !important;
    line-height:1.5 !important;
    flex:1 1 auto !important;
  }
}

/* === SOURCE: 194-mobile-lite-imagecomic-and-details-button.css === */
/* Patch v26: Mobile Lite card imagecomic pair + four pills + original-style details button */
@media (max-width: 820px), (hover: none) and (pointer: coarse){
  #result .card.ccc-mobile-lite-card{
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    justify-items: stretch !important;
    width: 100% !important;
  }

  #result .card.ccc-mobile-lite-card > .thumb.ccc-mobile-lite-thumb{
    grid-column: 1 / -1 !important;
    width: 100% !important;
    justify-self: center !important;
    align-items: center !important;
  }

  #result .card.ccc-mobile-lite-card > div:nth-child(2){
    display: block !important;
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-image-pair{
    width: 100% !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 10px !important;
    min-width: 0 !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-image-pair.is-single-image{
    justify-content: center !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-image-pair.has-imagecomic .ccc-mobile-lite-main-img{
    width: min(44vw, 170px) !important;
    max-width: calc((100vw - 42px) / 2) !important;
    aspect-ratio: 3 / 4 !important;
    object-fit: contain !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-image-pair.is-single-image .ccc-mobile-lite-main-img{
    width: min(62vw, 210px) !important;
    max-width: 100% !important;
    aspect-ratio: 3 / 4 !important;
    object-fit: contain !important;
  }

  #result .card.ccc-mobile-lite-card .pillgrid{
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 2px !important;
  }

  #result .card.ccc-mobile-lite-card .pillgrid .pill.mobile-card-number-pill{
    display: grid !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 8px !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills .ccc-mobile-lite-full-details-btn{
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
    text-align: center !important;
    justify-content: center !important;
    cursor: pointer !important;
  }
}

/* Mobile logged-in Quick View owner-card swipe: native, three-image carousel. */
@media (max-width: 820px), (hover: none) and (pointer: coarse){
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-swipe-stage{
    --ccc-lite-slide-width:min(62vw, 210px);
    box-sizing:border-box !important;
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:12px !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding-inline:calc((100% - var(--ccc-lite-slide-width)) / 2) !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scroll-snap-type:x mandatory !important;
    scroll-padding-inline:calc((100% - var(--ccc-lite-slide-width)) / 2) !important;
    scroll-behavior:auto !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
    touch-action:pan-x pan-y !important;
    -ms-touch-action:pan-x pan-y !important;
    overscroll-behavior-x:contain !important;
    overscroll-behavior-y:auto !important;
    -webkit-user-select:none !important;
    user-select:none !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-swipe-stage::-webkit-scrollbar{
    display:none !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-swipe-stage.is-recycling{
    scroll-snap-type:none !important;
    scroll-behavior:auto !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-swipe-slide{
    --ccc-lite-slide-focus:0;
    box-sizing:border-box !important;
    flex:0 0 var(--ccc-lite-slide-width) !important;
    width:var(--ccc-lite-slide-width) !important;
    min-width:var(--ccc-lite-slide-width) !important;
    aspect-ratio:3 / 4 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    scroll-snap-align:center !important;
    scroll-snap-stop:always !important;
    opacity:calc(.28 + (var(--ccc-lite-slide-focus) * .72)) !important;
    transform:scale(calc(.91 + (var(--ccc-lite-slide-focus) * .09))) !important;
    transform-origin:center center !important;
    transition:opacity 90ms linear, transform 90ms linear !important;
    will-change:transform, opacity !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-swipe-slide.is-current{
    z-index:2 !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-swipe-slide img,
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-image-pair.is-single-image .ccc-mobile-lite-main-img{
    box-sizing:border-box !important;
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:100% !important;
    aspect-ratio:3 / 4 !important;
    object-fit:contain !important;
    pointer-events:none !important;
    -webkit-user-drag:none !important;
    user-drag:none !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-swipe-dots{
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:var(--ccc-lite-dot-gap, 6px) !important;
    width:100% !important;
    min-height:18px !important;
    margin:5px auto 1px !important;
    padding:2px 8px !important;
    overflow-x:hidden !important;
    overflow-y:hidden !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
    touch-action:pan-x pan-y !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-swipe-dots::-webkit-scrollbar{
    display:none !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-swipe-dot{
    appearance:none !important;
    -webkit-appearance:none !important;
    flex:0 0 var(--ccc-lite-dot-size, 7px) !important;
    width:var(--ccc-lite-dot-size, 7px) !important;
    min-width:var(--ccc-lite-dot-size, 7px) !important;
    height:var(--ccc-lite-dot-size, 7px) !important;
    min-height:var(--ccc-lite-dot-size, 7px) !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.30) !important;
    box-shadow:none !important;
    outline:0 !important;
    opacity:1 !important;
    cursor:pointer !important;
    touch-action:manipulation !important;
    transition:width .12s ease, flex-basis .12s ease, background .12s ease !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-swipe-dot.is-active,
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-swipe-dot[aria-current="true"]{
    flex-basis:var(--ccc-lite-dot-active-size, 18px) !important;
    width:var(--ccc-lite-dot-active-size, 18px) !important;
    min-width:var(--ccc-lite-dot-active-size, 18px) !important;
    background:rgba(255,255,255,.92) !important;
  }
}

/* 2026-07-29: Keep a one-card Quick View at the exact active-carousel card size. */
@media (max-width: 820px), (hover: none) and (pointer: coarse){
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-image-pair.is-single-image{
    --ccc-lite-slide-width:min(62vw, 210px);
    width:100% !important;
    min-width:0 !important;
    align-items:center !important;
    justify-content:center !important;
  }

  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-image-pair.is-single-image .ccc-mobile-lite-main-img{
    box-sizing:border-box !important;
    flex:0 0 var(--ccc-lite-slide-width) !important;
    width:var(--ccc-lite-slide-width) !important;
    min-width:var(--ccc-lite-slide-width) !important;
    max-width:var(--ccc-lite-slide-width) !important;
    height:min(82.6667vw, 280px) !important;
    min-height:0 !important;
    max-height:none !important;
    aspect-ratio:3 / 4 !important;
    object-fit:contain !important;
  }
}

/* === SOURCE: 195-purchase-card-actions.css === */
/* Patch v27: purchase/search actions for mobile quick view, logged-out mobile, and desktop details */
.ccc-purchase-flyup-overlay{
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 16px;
  background: rgba(0,0,0,.62);
}
.ccc-purchase-flyup-modal{
  position: relative;
  width: min(560px, 100%);
  max-height: min(82vh, 720px);
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: var(--panel, #151021);
  color: var(--text, #fff);
  box-shadow: 0 24px 70px rgba(0,0,0,.45);
  padding: 16px;
}
.ccc-purchase-flyup-close{
  position: absolute;
  top: 8px;
  right: 10px;
  border: 0;
  background: transparent;
  color: var(--text, #fff);
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}
.ccc-purchase-flyup-modal h3{
  margin: 0 34px 12px 0;
  font-size: 18px;
}
.ccc-purchase-flyup-top{
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
.ccc-purchase-flyup-top img{
  width: 110px;
  aspect-ratio: 3 / 4;
  object-fit: contain;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.03);
}
.ccc-purchase-detail-row{
  display: grid;
  grid-template-columns: minmax(95px, .45fr) minmax(0, 1fr);
  gap: 8px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
  font-size: 13px;
}
.ccc-purchase-detail-row span{ color: var(--muted, #b9b2c7); }
.ccc-purchase-detail-row strong{ font-weight: 700; }
.ccc-purchase-owners-title{
  margin: 14px 0 8px;
  font-weight: 800;
  font-size: 14px;
}
.ccc-purchase-owners-list{
  display: grid;
  gap: 8px;
}
.ccc-purchase-owner-row{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 10px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px;
  background: rgba(255,255,255,.035);
}
.ccc-purchase-owner-name{ font-weight: 800; }
.ccc-purchase-owner-meta{ grid-column: 1 / -1; color: var(--muted, #b9b2c7); font-size: 12px; }
.ccc-contact-owner-btn{ pointer-events: auto; opacity: 1; cursor: pointer; }
.ccc-contact-owner-btn:disabled,
.ccc-contact-owner-btn[aria-disabled="true"]{ pointer-events: none; opacity: .46; cursor: not-allowed; }
.ccc-purchase-owner-row.is-related-issue-owner{ grid-template-columns: minmax(0, 1fr); }
.ccc-purchase-owner-row.is-related-issue-owner .ccc-purchase-owner-meta{ grid-column: 1; }
.ccc-purchase-related-title{ margin-top: 16px; }
.ccc-purchase-ebay-btn{ width: 100%; margin-top: 12px; justify-content: center; text-align: center; }

@media (max-width: 820px), (hover: none) and (pointer: coarse){
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills .ccc-mobile-lite-purchase-btn,
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills .ccc-mobile-lite-full-details-btn{
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    border-color: rgba(255,255,255,.16) !important;
    background: rgba(255,255,255,.075) !important;
    color: #ffffff !important;
    box-shadow: none !important;
  }
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills .ccc-mobile-lite-purchase-btn:hover,
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills .ccc-mobile-lite-purchase-btn:focus-visible,
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills .ccc-mobile-lite-purchase-btn:active,
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills .ccc-mobile-lite-full-details-btn:hover,
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills .ccc-mobile-lite-full-details-btn:focus-visible,
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills .ccc-mobile-lite-full-details-btn:active{
    border-color: rgba(255,255,255,.50) !important;
    background: rgba(255,255,255,.12) !important;
    color: #ffffff !important;
    box-shadow: none !important;
  }
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills .ccc-mobile-lite-purchase-btn{
    grid-column: 1 !important;
  }
  #result .card.ccc-mobile-lite-card .ccc-mobile-lite-full-details-under-pills .ccc-mobile-lite-full-details-btn{
    grid-column: 2 !important;
  }
  #result .card .ccc-mobile-logged-out-ebay-wrap{
    width: 100% !important;
    display: grid !important;
    justify-items: center !important;
    margin: 8px 0 0 !important;
  }
  #result .card .ccc-mobile-logged-out-ebay-btn{
    width: min(100%, 360px) !important;
    justify-content: center !important;
    text-align: center !important;
  }
  .ccc-purchase-flyup-overlay{
    top: var(--ccc-mobile-popup-top, 56px);
    right: 0;
    bottom: auto;
    left: 0;
    height: calc(100vh - var(--ccc-mobile-popup-top, 56px));
    height: calc(100dvh - var(--ccc-mobile-popup-top, 56px));
    min-height: 0;
    max-height: calc(100dvh - var(--ccc-mobile-popup-top, 56px));
    align-items: flex-end;
    padding: 0;
    overflow: hidden;
    overscroll-behavior: none;
  }
  .ccc-purchase-flyup-modal{
    width: 100%;
    max-width: none;
    max-height: 100%;
    min-height: 0;
    margin: 0;
    padding: 16px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 18px 18px 0 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }
  .ccc-purchase-flyup-top{
    grid-template-columns: 92px minmax(0, 1fr);
  }
  .ccc-purchase-flyup-top img{ width: 92px; }
}

@media (min-width: 821px) and (hover: hover){
  #result .card .desktop-member-info-right.ccc-desktop-purchase-column{
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
  }
  #result .card .desktop-member-info-right.ccc-desktop-purchase-column > .more{
    max-height: 315px !important;
    overflow-y: auto !important;
  }
  #result .card .ccc-desktop-purchase-btn{
    margin-top: 10px !important;
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }
  .ccc-purchase-flyup-overlay{
    align-items: center;
  }
}

/* Patch v28: mobile full-view purchase/eBay buttons use the 1CC Gallery placement/style. */
@media (max-width: 780px){
  html body #result .card .card-main > button.ccc-mobile-public-ebay-action,
  html body #result .card .card-main > button.ccc-mobile-full-purchase-action,
  html body #result .card .card-main > button.ccc-mobile-public-ebay-action:focus,
  html body #result .card .card-main > button.ccc-mobile-full-purchase-action:focus,
  html body #result .card .card-main > button.ccc-mobile-public-ebay-action:focus-visible,
  html body #result .card .card-main > button.ccc-mobile-full-purchase-action:focus-visible,
  html body #result .card .card-main > button.ccc-mobile-public-ebay-action:active,
  html body #result .card .card-main > button.ccc-mobile-full-purchase-action:active{
    grid-column: 1 / -1 !important;
    justify-self: stretch !important;
    align-self: stretch !important;
    box-sizing: border-box !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-flex !important;
    visibility: visible !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    padding: 0 !important;
    margin: 4px 0 2px 0 !important;
    gap: 0 !important;
    border: 1px solid var(--border) !important;
    border-bottom: 1px solid var(--border) !important;
    border-radius: 10px !important;
    background: var(--panel) !important;
    color: var(--text) !important;
    opacity: 1 !important;
    overflow: hidden !important;
    box-shadow: none !important;
    outline: 0 !important;
    transform: none !important;
    text-align: center !important;
    text-decoration: none !important;
    white-space: normal !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .01em !important;
    transition: background .15s ease, border-color .15s ease, color .15s ease !important;
  }

  html body #result .card .card-main > button.ccc-mobile-full-purchase-action{
    margin-top: 0 !important;
  }

  @media (hover: hover) and (pointer: fine){
    html body #result .card .card-main > button.ccc-mobile-public-ebay-action:hover,
    html body #result .card .card-main > button.ccc-mobile-full-purchase-action:hover{
      border-color: rgba(255,255,255,.6) !important;
      border-bottom-color: rgba(255,255,255,.6) !important;
      background: rgba(255,255,255,.08) !important;
      color: #fff !important;
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.60) !important;
      outline: none !important;
      transform: none !important;
    }
  }
}

/* Patch v29: tighten mobile spacing between 1CC Gallery/Set Comic Cuts and Purchase This Card. */
@media (max-width: 780px){
  html body .card.ccc-logged-in-card .card-main > button.mobile-1cc-gallery-toggle.mobile-1cc-gallery-toggle--value-style:not(.ccc-mobile-full-purchase-action){
    margin-bottom: 1px !important;
  }
  html body #result .card .card-main > button.ccc-mobile-full-purchase-action{
    margin-top: 1px !important;
  }
}

/* === SOURCE: 196-main-page-circular-action-toolbar.css === */
/* Main page public quick actions: four rounded-square icon buttons with labels. */
.card .ccc-main-quick-actions{
  box-sizing:border-box !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) auto minmax(0, 1fr) !important;
  align-items:start !important;
  justify-items:stretch !important;
  gap:clamp(6px, 1.6vw, 18px) !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:0 0 14px !important;
  padding:2px 0 0 !important;
  overflow:visible !important;
}

.card .ccc-main-quick-actions > #comicCutNav.comic-cut-nav.is-visible{
  display:contents !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

.card .ccc-main-quick-actions > #comicCutNav.comic-cut-nav:not(.is-visible){
  display:none !important;
}

.card .ccc-main-quick-actions #comicCutNavCounters{
  display:none !important;
}

/*
  Include both nav IDs in these selectors so this toolbar beats the older
  three-square-button navigation rules without changing that layout elsewhere.
*/
html body .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control),
html body .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control),
html body .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control),
html body .card .ccc-main-quick-actions > .ccc-public-ebay-circle-action{
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  justify-self:stretch !important;
  align-self:start !important;
  gap:6px !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:auto !important;
  min-height:76px !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 2px !important;
  border:0 !important;
  border-bottom:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--text) !important;
  box-shadow:none !important;
  opacity:1 !important;
  overflow:visible !important;
  text-align:center !important;
  text-decoration:none !important;
  white-space:normal !important;
  cursor:pointer !important;
  transform:none !important;
  transition:none !important;
}

html body .card .ccc-main-quick-actions .ccc-main-action-circle{
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 54px !important;
  width:54px !important;
  height:54px !important;
  min-width:54px !important;
  min-height:54px !important;
  max-width:54px !important;
  max-height:54px !important;
  padding:0 !important;
  border:1px solid rgba(255,255,255,.22) !important;
  border-radius:14px !important;
  background:var(--panel) !important;
  color:var(--text) !important;
  box-shadow:0 7px 18px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.025) !important;
  overflow:hidden !important;
  transform:none !important;
  transition:background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease !important;
}

html body .card .ccc-main-quick-actions .ccc-main-action-circle .material-symbols-outlined{
  display:block !important;
  flex:0 0 auto !important;
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  font-size:25px !important;
  line-height:1 !important;
  color:inherit !important;
}


html body .card .ccc-main-quick-actions > .ccc-main-action-divider{
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  align-self:start !important;
  width:auto !important;
  min-width:12px !important;
  height:54px !important;
  margin:0 !important;
  padding:0 1px !important;
  color:rgba(255,255,255,.72) !important;
  font-size:25px !important;
  font-weight:300 !important;
  line-height:1 !important;
  user-select:none !important;
  pointer-events:none !important;
}

html body .card .ccc-main-quick-actions .ccc-main-action-label{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  color:var(--text) !important;
  font-size:12px !important;
  font-weight:650 !important;
  line-height:1.15 !important;
  letter-spacing:.01em !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

@media (hover: hover) and (pointer: fine){

html body .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):hover:not(:disabled) .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):hover:not(:disabled) .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):hover:not(:disabled) .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > .ccc-public-ebay-circle-action:hover .ccc-main-action-circle{
  border-color:rgba(255,255,255,.68) !important;
  background:rgba(255,255,255,.10) !important;
  box-shadow:0 9px 22px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.42) !important;
  transform:translateY(-1px) !important;
}
}

html body .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):focus-visible .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):focus-visible .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):focus-visible .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > .ccc-public-ebay-circle-action:focus-visible .ccc-main-action-circle{
  border-color:rgba(255,255,255,.68) !important;
  background:rgba(255,255,255,.10) !important;
  box-shadow:0 9px 22px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.42) !important;
  transform:translateY(-1px) !important;
}

@media (hover: hover) and (pointer: fine){

html body .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
html body .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
html body .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):hover:not(:disabled){
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:none !important;
}
}

html body .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):focus-visible,
html body .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):focus-visible,
html body .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):focus-visible,
html body .card .ccc-main-quick-actions > .ccc-public-ebay-circle-action:focus-visible{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:none !important;
}

html body .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):disabled,
html body .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):disabled,
html body .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):disabled{
  opacity:.38 !important;
  cursor:not-allowed !important;
  pointer-events:none !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:var(--text) !important;
}

@media (min-width:781px){
  .card .desktop-member-info-left.has-public-quick-actions{
    grid-template-rows:auto auto minmax(0, 360px) !important;
  }

  .card .desktop-member-info-left > .ccc-main-quick-actions{
    align-self:start !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  /* Match the desktop Comic Book Issue and Serial Number pills to the action buttons. */
  .card .desktop-member-info-left > .pillgrid .pill{
    border-color:rgba(255,255,255,.22) !important;
    background:var(--panel) !important;
    box-shadow:0 7px 18px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.025) !important;
  }

  .card .desktop-member-info-left > .pillgrid .pill label,
  .card .desktop-member-info-left > .pillgrid .pill > div:not(.custom-dd-wrapper),
  .card .desktop-member-info-left > .pillgrid .pill .custom-dd-trigger{
    color:#fff !important;
  }
}

/* Desktop-only: enlarge the scrollable Additional Information window. */
@media (min-width:781px){
  #result .card .desktop-member-info-right.ccc-desktop-purchase-column > .more,
  #result .card .desktop-member-info-right.ccc-desktop-purchase-column > .more[style*="display: block"]{
    display:block !important;
    height:620px !important;
    min-height:620px !important;
    max-height:620px !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }
}

/* Desktop-only polish: icon-only actions, issue-pill hover match, compact highlights. */
@media (min-width:781px){
  html body .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control),
  html body .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control),
  html body .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control),
  html body .card .ccc-main-quick-actions > .ccc-public-ebay-circle-action{
    gap:0 !important;
    min-height:54px !important;
    padding:0 2px !important;
  }

  html body .card .ccc-main-quick-actions .ccc-main-action-label{
    display:none !important;
  }

  /* Match the clickable Comic Book Issue pill hover; Serial Number stays static. */
  @media (hover: hover) and (pointer: fine){
  html body .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):hover:not(:disabled) .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):hover:not(:disabled) .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):hover:not(:disabled) .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > .ccc-public-ebay-circle-action:hover .ccc-main-action-circle{
    border-color:#ffffff !important;
    background:
      linear-gradient(180deg, rgba(154,139,255,.044), rgba(255,255,255,.012) 42%, rgba(255,255,255,.008)),
      radial-gradient(520px 160px at 0% -10%, rgba(154,139,255,.075), transparent 68%) !important;
    box-shadow:var(--cc-panel-glow, 0 18px 42px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035)) !important;
    transform:none !important;
  }
  }
  html body .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):focus-visible .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):focus-visible .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):focus-visible .ccc-main-action-circle,
html body .card .ccc-main-quick-actions > .ccc-public-ebay-circle-action:focus-visible .ccc-main-action-circle{
    border-color:#ffffff !important;
    background:
      linear-gradient(180deg, rgba(154,139,255,.044), rgba(255,255,255,.012) 42%, rgba(255,255,255,.008)),
      radial-gradient(520px 160px at 0% -10%, rgba(154,139,255,.075), transparent 68%) !important;
    box-shadow:var(--cc-panel-glow, 0 18px 42px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035)) !important;
    transform:none !important;
  }

  /* Hide explanatory sentences below desktop Value Highlights results. */
  .card .desktop-member-info-left .cc-highlight-note{
    display:none !important;
  }
}

/* Mobile Full Detail action toolbar. Public viewers use Checklist, Previous,
   Next, and Random Card. Logged-in viewers use Add/Edit, Favorite-or-Bookmark,
   1CC Gallery, and Random Card. */
@media (max-width:780px){
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row{
    box-sizing:border-box !important;
    grid-column:1 / -1 !important;
    display:grid !important;
    grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
    align-items:start !important;
    justify-items:stretch !important;
    column-gap:4px !important;
    row-gap:0 !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:12px 0 8px !important;
    padding:0 2px !important;
    overflow:visible !important;
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-public-actions{
    grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-member-actions{
    grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row > #comicCutNav.comic-cut-nav.is-visible{
    display:contents !important;
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row > #comicCutNav.comic-cut-nav:not(.is-visible){
    display:none !important;
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #comicCutNavCounters{
    display:none !important;
    visibility:hidden !important;
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #backToSetBtn,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #setChecklistBtn,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #nextComicCutBtn,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row > .ccc-mobile-favorite-action-btn,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row > .ccc-mobile-bookmark-action-btn,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row > .ccc-mobile-1cc-gallery-nav-btn,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row > .ccc-mobile-random-card-action-btn,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row > .ccc-card-edit-add-btn{
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:7px !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:auto !important;
    min-height:86px !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 1px !important;
    border:0 !important;
    border-bottom:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    color:var(--text) !important;
    box-shadow:none !important;
    opacity:1 !important;
    overflow:visible !important;
    text-align:center !important;
    text-decoration:none !important;
    white-space:normal !important;
    transform:none !important;
  }

  /* Logged-out/public mobile order: Checklist / Previous / Next / Random Card. */
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-public-actions #setChecklistBtn{ order:1 !important; grid-column:1 !important; }
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-public-actions #backToSetBtn{ order:2 !important; grid-column:2 !important; }
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-public-actions #nextComicCutBtn{ order:3 !important; grid-column:3 !important; }
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-public-actions > .ccc-mobile-random-card-action-btn{ order:4 !important; grid-column:4 !important; }

  /* Logged-in mobile order: Add/Edit / Favorite-or-Bookmark / 1CC Gallery / Random Card. */
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-member-actions #backToSetBtn,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-member-actions #nextComicCutBtn{
    display:none !important;
  }
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-member-actions > .ccc-card-edit-add-btn{ order:1 !important; grid-column:1 !important; }
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-member-actions > .ccc-mobile-favorite-action-btn{ order:2 !important; grid-column:2 !important; }
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-member-actions > .ccc-mobile-bookmark-action-btn{ order:2 !important; grid-column:2 !important; }
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-member-actions > .ccc-mobile-1cc-gallery-nav-btn{ order:3 !important; grid-column:3 !important; }
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row.is-member-actions > .ccc-mobile-random-card-action-btn{ order:4 !important; grid-column:4 !important; }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row .ccc-main-action-circle{
    box-sizing:border-box !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 56px !important;
    width:56px !important;
    height:56px !important;
    min-width:56px !important;
    min-height:56px !important;
    max-width:56px !important;
    max-height:56px !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid rgba(255,255,255,.16) !important;
    border-radius:50% !important;
    background:rgba(255,255,255,.075) !important;
    color:var(--text) !important;
    box-shadow:none !important;
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row .ccc-main-action-circle .material-symbols-outlined{
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:inherit !important;
    font-size:27px !important;
    line-height:1 !important;
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row .ccc-main-action-label{
    box-sizing:border-box !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:0 !important;
    width:100% !important;
    min-width:0 !important;
    min-height:2.2em !important;
    margin:0 !important;
    padding:0 !important;
    color:var(--text) !important;
    font-size:11px !important;
    font-weight:650 !important;
    line-height:1.1 !important;
    letter-spacing:0 !important;
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row .ccc-main-action-label > span{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:clip !important;
  }

  @media (hover: hover) and (pointer: fine){

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row button:hover:not(:disabled){
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    outline:none !important;
    transform:none !important;
  }
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row button:focus-visible,
html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row button:active{
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    outline:none !important;
    transform:none !important;
  }

  @media (hover: hover) and (pointer: fine){

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row button:hover:not(:disabled) .ccc-main-action-circle{
    border-color:rgba(255,255,255,.5) !important;
    background:rgba(255,255,255,.12) !important;
  }
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row button:focus-visible .ccc-main-action-circle,
html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row button:active .ccc-main-action-circle{
    border-color:rgba(255,255,255,.5) !important;
    background:rgba(255,255,255,.12) !important;
  }

  /* The current gallery mode stays visibly selected without being disabled. */
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row > .ccc-mobile-full-gallery-mode-action.is-active-gallery-mode .ccc-main-action-circle,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row > .ccc-mobile-full-gallery-mode-action[aria-pressed="true"] .ccc-main-action-circle{
    border-color:#fff !important;
    background:rgba(255,255,255,.11) !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.08) !important;
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row > .ccc-mobile-full-gallery-mode-action.is-active-gallery-mode .ccc-main-action-label,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row > .ccc-mobile-full-gallery-mode-action[aria-pressed="true"] .ccc-main-action-label{
    color:#fff !important;
  }

  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row button:disabled,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row button[aria-disabled="true"]{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }
}

/* === SOURCE: 197-desktop-text-summary-member-actions.css === */
/* Desktop-only text summary row + unified member/public action row. */
@media (min-width:781px){
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout{
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr) !important;
    grid-template-rows:auto minmax(0,1fr) !important;
    gap:12px !important;
    align-items:stretch !important;
  }

  #result .card .ccc-desktop-summary-actions{
    grid-column:1 / -1 !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-rows:auto auto !important;
    gap:12px !important;
    width:100% !important;
  }

  #result .card .pillgrid.ccc-desktop-summary-text-row{
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
    gap:clamp(14px,2.4vw,34px) !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:2px 4px 0 !important;
  }

  #result .card .pillgrid.ccc-desktop-summary-text-row.is-logged-in-summary{
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
  }

  #result .card .pillgrid.ccc-desktop-summary-text-row.is-logged-out-summary{
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
  }

  #result .card .pillgrid.ccc-desktop-summary-text-row > .pill,
  #result .card .pillgrid.ccc-desktop-summary-text-row > .pill:hover,
  #result .card .pillgrid.ccc-desktop-summary-text-row > .pill:focus,
  #result .card .pillgrid.ccc-desktop-summary-text-row > .pill:focus-visible{
    box-sizing:border-box !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    min-width:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    text-align:center !important;
    outline:none !important;
    overflow:visible !important;
  }

  #result .card .pillgrid.ccc-desktop-summary-text-row > .pill > label{
    box-sizing:border-box !important;
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 0 9px !important;
    padding:0 4px 8px !important;
    border:0 !important;
    border-bottom:1px solid rgba(255,255,255,.24) !important;
    color:rgba(255,255,255,.68) !important;
    font-size:11px !important;
    font-weight:750 !important;
    line-height:1.15 !important;
    letter-spacing:.08em !important;
    text-align:center !important;
    text-transform:uppercase !important;
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
    transition:border-color .15s ease, color .15s ease !important;
  }

  #result .card .pillgrid.ccc-desktop-summary-text-row > .pill > div:not(.custom-dd-wrapper),
  #result .card .pillgrid.ccc-desktop-summary-text-row > .pill > .custom-dd-wrapper,
  #result .card .pillgrid.ccc-desktop-summary-text-row > .pill .custom-dd-trigger{
    box-sizing:border-box !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#fff !important;
    font-size:15px !important;
    font-weight:650 !important;
    line-height:1.25 !important;
    text-align:center !important;
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
    height:auto !important;
    max-height:none !important;
  }

  #result .card .pillgrid.ccc-desktop-summary-text-row .custom-dd-trigger{
    cursor:pointer !important;
  }

  #result .card .pillgrid.ccc-desktop-summary-text-row .custom-dd-trigger .dd-arrow,
  #result .card .pillgrid.ccc-desktop-summary-text-row .owner-pill-mc-icon{
    display:none !important;
  }

  /* Clickable desktop summary fields use the requested line-highlight hover. */
  #result .card .pillgrid.ccc-desktop-summary-text-row > .issue-pill-checklist:hover > label,
  #result .card .pillgrid.ccc-desktop-summary-text-row > .issue-pill-checklist:focus-visible > label,
  #result .card .pillgrid.ccc-desktop-summary-text-row.is-logged-out-summary > .set-pill-checklist:hover > label,
  #result .card .pillgrid.ccc-desktop-summary-text-row.is-logged-out-summary > .set-pill-checklist:focus-visible > label,
  #result .card .pillgrid.ccc-desktop-summary-text-row > .ccc-owner-summary-field:hover > label,
  #result .card .pillgrid.ccc-desktop-summary-text-row > .ccc-owner-summary-field:focus-visible > label{
    border-bottom-color:#fff !important;
    color:#fff !important;
  }

  #result .card .ccc-main-quick-actions{
    box-sizing:border-box !important;
    display:grid !important;
    grid-auto-flow:column !important;
    grid-template-rows:54px !important;
    align-items:center !important;
    justify-items:center !important;
    justify-content:center !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
    padding:2px 4px !important;
    gap:clamp(8px,1.6vw,22px) !important;
  }

  #result .card .ccc-main-quick-actions.is-logged-out{
    grid-template-columns:repeat(3,54px) 12px 54px !important;
  }

  #result .card .ccc-main-quick-actions.is-logged-in{
    grid-template-columns:repeat(6,54px) 12px 54px !important;
  }

  #result .card .ccc-main-quick-actions > .comic-cut-main-actions,
  #result .card .ccc-main-quick-actions > #comicCutNav.comic-cut-nav.is-visible,
  #result .card .ccc-main-quick-actions > #comicCutNav.ccc-logged-in-checklist-mode.comic-cut-nav.is-visible{
    display:contents !important;
  }

  html body #result .card .ccc-main-quick-actions .comic-cut-main-actions > .icon-btn,
  html body #result .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control),
  html body #result .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control),
  html body #result .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control),
  html body #result .card .ccc-main-quick-actions > .ccc-desktop-ebay-action{
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    justify-self:center !important;
    align-self:center !important;
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    min-height:54px !important;
    max-width:54px !important;
    max-height:54px !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid rgba(255,255,255,.22) !important;
    border-radius:14px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:0 7px 18px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.025) !important;
    overflow:hidden !important;
    opacity:1 !important;
    text-decoration:none !important;
    cursor:pointer !important;
    transform:none !important;
    transition:background .15s ease,border-color .15s ease,box-shadow .15s ease !important;
  }

  html body #result .card .ccc-main-quick-actions .comic-cut-main-actions > .icon-btn::before,
  html body #result .card .ccc-main-quick-actions .comic-cut-main-actions > .icon-btn::after,
  html body #result .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control)::before,
  html body #result .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control)::after,
  html body #result .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control)::before,
  html body #result .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control)::after,
  html body #result .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control)::before,
  html body #result .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control)::after,
  html body #result .card .ccc-main-quick-actions > .ccc-desktop-ebay-action::before,
  html body #result .card .ccc-main-quick-actions > .ccc-desktop-ebay-action::after{
    content:none !important;
    display:none !important;
  }

  html body #result .card .ccc-main-quick-actions .material-symbols-outlined{
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:inherit !important;
    font-size:25px !important;
    line-height:1 !important;
  }

  html body #result .card .ccc-main-quick-actions .comic-cut-main-actions > .icon-btn:hover:not(:disabled),
  html body #result .card .ccc-main-quick-actions .comic-cut-main-actions > .icon-btn:focus-visible,
  html body #result .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body #result .card .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):focus-visible,
  html body #result .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body #result .card .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):focus-visible,
  html body #result .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body #result .card .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):focus-visible,
  html body #result .card .ccc-main-quick-actions > .ccc-desktop-ebay-action:hover,
  html body #result .card .ccc-main-quick-actions > .ccc-desktop-ebay-action:focus-visible{
    border-color:#fff !important;
    background:linear-gradient(180deg,rgba(154,139,255,.044),rgba(255,255,255,.012) 42%,rgba(255,255,255,.008)),radial-gradient(520px 160px at 0% -10%,rgba(154,139,255,.075),transparent 68%) !important;
    box-shadow:var(--cc-panel-glow,0 18px 42px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.035)) !important;
    outline:none !important;
    transform:none !important;
  }

  /* Restore the explanatory sentence beneath each desktop Value Highlight. */
  #result .card .desktop-member-info-left .cc-highlight-note{
    display:block !important;
  }

  html body #result .card .ccc-main-quick-actions button:disabled{
    opacity:.38 !important;
    cursor:not-allowed !important;
    pointer-events:none !important;
  }

  #result .card .ccc-main-quick-actions > .ccc-main-action-divider{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:12px !important;
    min-width:12px !important;
    height:54px !important;
    margin:0 !important;
    padding:0 !important;
    color:rgba(255,255,255,.72) !important;
    font-size:25px !important;
    font-weight:300 !important;
    line-height:1 !important;
    pointer-events:none !important;
    user-select:none !important;
  }

  #result .card .desktop-member-info-left{
    min-width:0 !important;
    display:block !important;
  }

  #result .card .desktop-member-info-left > .cc-highlights-panel{
    height:360px !important;
    max-height:360px !important;
    margin:0 !important;
  }

  /* If navigation refreshes restore the older labeled markup, keep this row icon-only. */
  html body #result .card .ccc-main-quick-actions .ccc-main-action-circle{
    display:contents !important;
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:none !important;
    max-height:none !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body #result .card .ccc-main-quick-actions .ccc-main-action-label{
    display:none !important;
  }

}

/* Desktop: position the action row by login state while keeping equal-height detail panels. */
@media (min-width:781px){
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout{
    grid-template-rows:auto auto 360px !important;
    align-items:stretch !important;
  }

  #result .card .ccc-desktop-summary-actions{
    grid-column:1 / -1 !important;
    display:block !important;
  }

  /* Logged-in: below the horizontal thumbnail scroller, actions come before Owner / Comic Book Issue. */
  /* Logged-in desktop only: reduce the two gaps surrounding the summary row by 15% (12px to 10.2px). */
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout{
    row-gap:10.2px !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .ccc-main-quick-actions{
    grid-column:1 / -1 !important;
    grid-row:1 !important;
    margin:0 !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .ccc-desktop-summary-actions{
    grid-row:2 !important;
  }

  /* Logged-out: Comic Book Issue / Set / Subset stay first, then actions, then the detail panels. */
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-out-layout > .ccc-desktop-summary-actions{
    grid-row:1 !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-out-layout > .ccc-main-quick-actions{
    grid-column:1 / -1 !important;
    grid-row:2 !important;
    margin:0 !important;
  }

  #result .card .desktop-member-info-left{
    grid-column:1 !important;
    grid-row:3 !important;
    min-height:0 !important;
    height:360px !important;
    max-height:360px !important;
    overflow:hidden !important;
  }

  #result .card .desktop-member-info-left > .cc-highlights-panel{
    box-sizing:border-box !important;
    height:360px !important;
    min-height:360px !important;
    max-height:360px !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }

  #result .card .desktop-member-info-right.ccc-desktop-purchase-column{
    grid-column:2 !important;
    grid-row:3 !important;
    min-height:0 !important;
    height:360px !important;
    max-height:360px !important;
    overflow:hidden !important;
  }

  #result .card .desktop-member-info-right.ccc-desktop-purchase-column > .more,
  #result .card .desktop-member-info-right.ccc-desktop-purchase-column > .more[style*="display: block"]{
    box-sizing:border-box !important;
    display:block !important;
    height:360px !important;
    min-height:360px !important;
    max-height:360px !important;
    margin:0 !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }
}

/* === SOURCE: 198-desktop-top-card-action-row.css === */
/* Desktop-only: place the current card actions directly below the main search/navigation row. */
.ccc-desktop-top-actions-host{
  display:none;
}

@media (min-width:781px){
  .ccc-desktop-top-actions-host[hidden]{
    display:none !important;
  }

  .ccc-desktop-top-actions-host:not([hidden]){
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    max-width:720px !important;
    min-width:0 !important;
    margin:18px auto 0 !important;
    padding:0 !important;
  }

  .ccc-desktop-top-actions-host .ccc-main-quick-actions{
    box-sizing:border-box !important;
    display:grid !important;
    grid-auto-flow:column !important;
    grid-template-rows:44px !important;
    align-items:center !important;
    justify-items:center !important;
    justify-content:center !important;
    width:max-content !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 auto !important;
    padding:0 !important;
    gap:10px !important;
    overflow:visible !important;
  }

  .ccc-desktop-top-actions-host .ccc-main-quick-actions.is-logged-out{
    grid-template-columns:repeat(3,44px) 12px 44px !important;
  }

  .ccc-desktop-top-actions-host .ccc-main-quick-actions.is-logged-in{
    grid-template-columns:repeat(6,44px) 12px 44px !important;
  }

  .ccc-desktop-top-actions-host .ccc-main-quick-actions > .comic-cut-main-actions,
  .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav.comic-cut-nav.is-visible,
  .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav.ccc-logged-in-checklist-mode.comic-cut-nav.is-visible{
    display:contents !important;
  }

  .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav.comic-cut-nav:not(.is-visible){
    display:none !important;
  }

  .ccc-desktop-top-actions-host .ccc-main-quick-actions #comicCutNavCounters{
    display:none !important;
  }

  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions .comic-cut-main-actions > .icon-btn,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > .ccc-desktop-ebay-action{
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    min-height:44px !important;
    max-width:44px !important;
    max-height:44px !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid rgba(255,255,255,.22) !important;
    border-radius:14px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:0 7px 18px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.025) !important;
    overflow:hidden !important;
    opacity:1 !important;
    text-decoration:none !important;
    cursor:pointer !important;
    transform:none !important;
    transition:background .15s ease,border-color .15s ease,box-shadow .15s ease !important;
  }

  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions .comic-cut-main-actions > .icon-btn::before,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions .comic-cut-main-actions > .icon-btn::after,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav button::before,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav button::after,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > .ccc-desktop-ebay-action::before,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > .ccc-desktop-ebay-action::after{
    content:none !important;
    display:none !important;
  }

  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions .material-symbols-outlined{
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:inherit !important;
    font-size:24px !important;
    line-height:1 !important;
  }

  /* Comic-cut navigation matches the Browse List control exactly. */
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control){
    flex:0 0 44px !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    padding:10px !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:none !important;
    outline:none !important;
    transform:none !important;
    transition:background .15s ease,border-color .15s ease,color .15s ease !important;
  }

  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav .material-symbols-outlined{
    font-size:22px !important;
  }

  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions .comic-cut-main-actions > .icon-btn:hover:not(:disabled),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions .comic-cut-main-actions > .icon-btn:focus-visible,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):focus-visible,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):focus-visible,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):focus-visible,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > .ccc-desktop-ebay-action:hover,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > .ccc-desktop-ebay-action:focus-visible{
    border-color:#fff !important;
    background:linear-gradient(180deg,rgba(154,139,255,.044),rgba(255,255,255,.012) 42%,rgba(255,255,255,.008)),radial-gradient(520px 160px at 0% -10%,rgba(154,139,255,.075),transparent 68%) !important;
    box-shadow:var(--cc-panel-glow,0 18px 42px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.035)) !important;
    outline:none !important;
    transform:none !important;
  }

  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #setChecklistBtn:not(.ccc-shared-icon-control):focus-visible,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #backToSetBtn:not(.ccc-shared-icon-control):focus-visible,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions > #comicCutNav #nextComicCutBtn:not(.ccc-shared-icon-control):focus-visible{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
    box-shadow:none !important;
    outline:none !important;
    transform:none !important;
  }

  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions button:disabled,
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions button[aria-disabled="true"],
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions button.is-disabled{
    border-color:rgba(180,184,196,.16) !important;
    background:rgba(112,116,128,.14) !important;
    color:rgba(188,192,204,.42) !important;
    box-shadow:none !important;
    opacity:1 !important;
    filter:grayscale(1) !important;
    cursor:not-allowed !important;
    pointer-events:none !important;
  }

  .ccc-desktop-top-actions-host .ccc-main-quick-actions > .ccc-main-action-divider{
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:12px !important;
    min-width:12px !important;
    height:44px !important;
    margin:0 !important;
    padding:0 !important;
    color:rgba(255,255,255,.72) !important;
    font-size:23px !important;
    font-weight:300 !important;
    line-height:1 !important;
    pointer-events:none !important;
    user-select:none !important;
  }

  /* Keep any refreshed navigation markup icon-only in the top action row. */
  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions .ccc-main-action-circle{
    display:contents !important;
  }

  html body .ccc-desktop-top-actions-host .ccc-main-quick-actions .ccc-main-action-label{
    display:none !important;
  }

  /* With actions removed from the card, summary sits above the equal-height panels. */
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout{
    grid-template-rows:auto 360px !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout > .ccc-desktop-summary-actions{
    grid-column:1 / -1 !important;
    grid-row:1 !important;
  }

  /* Override the older logged-in placement rule that put the summary in row 2. */
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .ccc-desktop-summary-actions,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-out-layout > .ccc-desktop-summary-actions{
    grid-column:1 / -1 !important;
    grid-row:1 !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout > .desktop-member-info-left{
    grid-column:1 !important;
    grid-row:2 !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout > .desktop-member-info-right{
    grid-column:2 !important;
    grid-row:2 !important;
  }
}

/* Logged-out desktop: keep card navigation directly above the thumbnail scroller. */
@media (min-width:781px){
  .searchwrap > #publicEbayTopBtn.icon-btn{
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    flex:0 0 44px !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    padding:10px !important;
    display:inline-flex;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:none !important;
  }

  .searchwrap > #publicEbayTopBtn.icon-btn:hover,
  .searchwrap > #publicEbayTopBtn.icon-btn:focus-visible{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
    outline:none !important;
  }

  #result .card .thumb > .ccc-public-thumb-nav{
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:repeat(3,44px) !important;
    grid-template-rows:44px !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    width:100% !important;
    min-width:0 !important;
    margin:10px 0 0 !important;
    padding:0 !important;
    overflow:visible !important;
  }

  #result .card .thumb > .ccc-public-thumb-nav > #comicCutNav.comic-cut-nav.is-visible{
    display:contents !important;
  }

  #result .card .thumb > .ccc-public-thumb-nav > #comicCutNav.comic-cut-nav:not(.is-visible),
  #result .card .thumb > .ccc-public-thumb-nav #comicCutNavCounters{
    display:none !important;
  }

  html body #result .card .thumb > .ccc-public-thumb-nav #setChecklistBtn:not(.ccc-shared-icon-control),
  html body #result .card .thumb > .ccc-public-thumb-nav #backToSetBtn:not(.ccc-shared-icon-control),
  html body #result .card .thumb > .ccc-public-thumb-nav #nextComicCutBtn:not(.ccc-shared-icon-control){
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 44px !important;
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    min-height:44px !important;
    max-width:44px !important;
    max-height:44px !important;
    margin:0 !important;
    padding:10px !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:none !important;
    overflow:hidden !important;
    opacity:1 !important;
    cursor:pointer !important;
    transform:none !important;
  }

  html body #result .card .thumb > .ccc-public-thumb-nav #setChecklistBtn:not(.ccc-shared-icon-control)::before,
  html body #result .card .thumb > .ccc-public-thumb-nav #setChecklistBtn:not(.ccc-shared-icon-control)::after,
  html body #result .card .thumb > .ccc-public-thumb-nav #backToSetBtn:not(.ccc-shared-icon-control)::before,
  html body #result .card .thumb > .ccc-public-thumb-nav #backToSetBtn:not(.ccc-shared-icon-control)::after,
  html body #result .card .thumb > .ccc-public-thumb-nav #nextComicCutBtn:not(.ccc-shared-icon-control)::before,
  html body #result .card .thumb > .ccc-public-thumb-nav #nextComicCutBtn:not(.ccc-shared-icon-control)::after{
    content:none !important;
    display:none !important;
  }

  html body #result .card .thumb > .ccc-public-thumb-nav .material-symbols-outlined{
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:inherit !important;
    font-size:22px !important;
    line-height:1 !important;
  }

  html body #result .card .thumb > .ccc-public-thumb-nav #setChecklistBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body #result .card .thumb > .ccc-public-thumb-nav #setChecklistBtn:not(.ccc-shared-icon-control):focus-visible,
  html body #result .card .thumb > .ccc-public-thumb-nav #backToSetBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body #result .card .thumb > .ccc-public-thumb-nav #backToSetBtn:not(.ccc-shared-icon-control):focus-visible,
  html body #result .card .thumb > .ccc-public-thumb-nav #nextComicCutBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
  html body #result .card .thumb > .ccc-public-thumb-nav #nextComicCutBtn:not(.ccc-shared-icon-control):focus-visible{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    box-shadow:none !important;
    outline:none !important;
  }

  html body #result .card .thumb > .ccc-public-thumb-nav button:disabled,
  html body #result .card .thumb > .ccc-public-thumb-nav button[aria-disabled="true"],
  html body #result .card .thumb > .ccc-public-thumb-nav button.is-disabled{
    border-color:rgba(180,184,196,.16) !important;
    background:rgba(112,116,128,.14) !important;
    color:rgba(188,192,204,.42) !important;
    box-shadow:none !important;
    opacity:1 !important;
    filter:grayscale(1) !important;
    cursor:not-allowed !important;
    pointer-events:none !important;
  }

  html body #result .card .thumb > .ccc-public-thumb-nav .ccc-main-action-circle{
    display:contents !important;
  }

  html body #result .card .thumb > .ccc-public-thumb-nav .ccc-main-action-label{
    display:none !important;
  }
}

/* === SOURCE: 199-public-mobile-thumb-nav-spacing.css === */
/* Public navigation placement and spacing refinements. */

/* Desktop logged-out: add breathing room between the three controls and below the summary row. */
@media (min-width:781px){
  #result .card .thumb > .ccc-public-thumb-nav{
    gap:16px !important;
    margin:20px 0 20px !important;
  }

  html body #result .card .thumb > .ccc-public-thumb-nav #setChecklistBtn,
  html body #result .card .thumb > .ccc-public-thumb-nav #backToSetBtn,
  html body #result .card .thumb > .ccc-public-thumb-nav #nextComicCutBtn{
    flex:0 0 44px !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-out-layout > .ccc-desktop-summary-actions,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .ccc-desktop-summary-actions{
    padding-bottom:28px !important;
  }

  /* Logged-in desktop: add breathing room above Owner / Comic Book Issue / Card Number. */
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .ccc-desktop-summary-actions{
    padding-top:28px !important;
  }
}

/* Mobile logged-out: mirror the public desktop placement without changing logged-in mobile. */
@media (max-width:780px){
  .searchwrap > #publicEbayTopBtn.icon-btn[hidden]{
    display:none !important;
  }

  .searchwrap > #publicEbayTopBtn.icon-btn:not([hidden]){
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    flex:0 0 44px !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    padding:10px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:none !important;
    opacity:1 !important;
    transform:none !important;
  }

  @media (hover: hover) and (pointer: fine){

  .searchwrap > #publicEbayTopBtn.icon-btn:hover{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
    outline:none !important;
  }
  }

  .searchwrap > #publicEbayTopBtn.icon-btn:focus-visible{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
    outline:none !important;
  }

  .searchwrap > #publicEbayTopBtn.icon-btn .material-symbols-outlined{
    font-size:22px !important;
    line-height:1 !important;
  }

  #result .card .card-main > .ccc-public-mobile-value-nav-panels{
    box-sizing:border-box !important;
    grid-column:1 / -1 !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:0 !important;
    margin:10px 0 0 !important;
  }

  #result .card .card-main > .ccc-public-mobile-value-nav-panels > .ccc-public-mobile-highlights{
    box-sizing:border-box !important;
    grid-column:1 / -1 !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile{
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:repeat(3,44px) !important;
    grid-template-rows:44px !important;
    align-items:center !important;
    justify-content:start !important;
    gap:4px !important;
    width:140px !important;
    min-width:140px !important;
    max-width:140px !important;
    margin:16px 0 14px !important;
    padding:0 !important;
    overflow:visible !important;
  }

  #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile > #comicCutNav.comic-cut-nav.is-visible{
    display:contents !important;
  }

  #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile > #comicCutNav.comic-cut-nav:not(.is-visible),
  #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #comicCutNavCounters{
    display:none !important;
  }

  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #setChecklistBtn,
  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #backToSetBtn,
  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #nextComicCutBtn{
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 44px !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    margin:0 !important;
    padding:10px !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:none !important;
    overflow:hidden !important;
    opacity:1 !important;
    cursor:pointer !important;
    transform:none !important;
  }

  /* Logged-out mobile order only: Previous, Checklist, Next. */
  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #backToSetBtn{
    grid-column:1 !important;
    grid-row:1 !important;
  }

  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #setChecklistBtn{
    grid-column:2 !important;
    grid-row:1 !important;
  }

  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #nextComicCutBtn{
    grid-column:3 !important;
    grid-row:1 !important;
  }

  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #setChecklistBtn::before,
  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #setChecklistBtn::after,
  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #backToSetBtn::before,
  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #backToSetBtn::after,
  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #nextComicCutBtn::before,
  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #nextComicCutBtn::after{
    content:none !important;
    display:none !important;
  }

  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile .material-symbols-outlined{
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:inherit !important;
    font-size:22px !important;
    line-height:1 !important;
  }

  @media (hover: hover) and (pointer: fine){

  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #setChecklistBtn:hover:not(:disabled),
html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #backToSetBtn:hover:not(:disabled),
html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #nextComicCutBtn:hover:not(:disabled){
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    box-shadow:none !important;
    outline:none !important;
  }
  }

  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #setChecklistBtn:focus-visible,
html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #backToSetBtn:focus-visible,
html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile #nextComicCutBtn:focus-visible{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    box-shadow:none !important;
    outline:none !important;
  }

  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile button:disabled,
  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile button[aria-disabled="true"],
  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile button.is-disabled{
    border-color:rgba(180,184,196,.16) !important;
    background:rgba(112,116,128,.14) !important;
    color:rgba(188,192,204,.42) !important;
    box-shadow:none !important;
    opacity:1 !important;
    filter:grayscale(1) !important;
    cursor:not-allowed !important;
    pointer-events:none !important;
  }

  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile .ccc-main-action-circle{
    display:contents !important;
  }

  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile .ccc-main-action-label{
    display:none !important;
  }
}

/* Logged-out mobile: restore the desktop-style status/value badge beneath the image. */
@media (max-width:780px){
  #result .card.ccc-public-mobile-card > .thumb > .ccc-public-mobile-counter-slot{
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:140px !important;
    min-width:140px !important;
    max-width:140px !important;
    min-height:26px !important;
    margin:12px 0 0 !important;
    padding:0 !important;
    overflow:visible !important;
  }

  #result .card.ccc-public-mobile-card > .thumb > .ccc-public-mobile-counter-slot > .comic-cut-nav-counters{
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex-wrap:wrap !important;
    width:140px !important;
    min-width:140px !important;
    max-width:140px !important;
    gap:5px !important;
    margin:0 !important;
  }

  #result .card.ccc-public-mobile-card > .thumb > .ccc-public-mobile-counter-slot > .comic-cut-nav-counters[hidden]{
    display:none !important;
  }

  #result .card.ccc-public-mobile-card > .thumb > .ccc-public-mobile-counter-slot .comic-cut-nav-counter{
    box-sizing:border-box !important;
    max-width:140px !important;
    white-space:normal !important;
    text-align:center !important;
    line-height:1.2 !important;
  }
}

/* === SOURCE: 200-desktop-member-highlight-actions.css === */
/* Desktop-only placement requested for thumbnail navigation and logged-in member actions. */
@media (min-width:781px){
  /* Desktop viewers use Checklist / Previous / Next above the thumbnail
     scroller in both guest and logged-in Full Details. */
  #result .card .thumb > .ccc-thumbnail-nav{
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:repeat(3,44px) !important;
    grid-template-rows:44px !important;
    align-items:center !important;
    justify-content:center !important;
    gap:16px !important;
    width:100% !important;
    min-width:0 !important;
    margin:20px 0 !important;
    padding:0 !important;
    overflow:visible !important;
  }

  #result .card .thumb > .ccc-thumbnail-nav.is-member-thumbnail-nav{
    grid-template-columns:repeat(3,44px) !important;
  }

  #result .card .thumb > .ccc-thumbnail-nav > #comicCutNav.comic-cut-nav.is-visible{
    display:contents !important;
  }

  #result .card .thumb > .ccc-thumbnail-nav > #comicCutNav.comic-cut-nav:not(.is-visible),
  #result .card .thumb > .ccc-thumbnail-nav #comicCutNavCounters{
    display:none !important;
  }

  html body #result .card .thumb > .ccc-thumbnail-nav #setChecklistBtn:not(.ccc-shared-icon-control),
  html body #result .card .thumb > .ccc-thumbnail-nav #backToSetBtn:not(.ccc-shared-icon-control),
  html body #result .card .thumb > .ccc-thumbnail-nav #nextComicCutBtn:not(.ccc-shared-icon-control){
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 44px !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    margin:0 !important;
    padding:10px !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:none !important;
    overflow:hidden !important;
    opacity:1 !important;
    cursor:pointer !important;
    transform:none !important;
  }


  /* Block 196 gives labeled navigation a separate 54px painted circle.
     Remove that inner box so both login states use the outer 44px button. */
  html body #result .card .thumb > .ccc-thumbnail-nav #setChecklistBtn:not(.ccc-shared-icon-control) > .ccc-main-action-circle,
  html body #result .card .thumb > .ccc-thumbnail-nav #backToSetBtn:not(.ccc-shared-icon-control) > .ccc-main-action-circle,
  html body #result .card .thumb > .ccc-thumbnail-nav #nextComicCutBtn:not(.ccc-shared-icon-control) > .ccc-main-action-circle{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 auto !important;
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body #result .card .thumb > .ccc-thumbnail-nav .ccc-main-action-label{
    display:none !important;
  }

  html body #result .card .thumb > .ccc-thumbnail-nav #setChecklistBtn:not(.ccc-shared-icon-control)::before,
  html body #result .card .thumb > .ccc-thumbnail-nav #setChecklistBtn:not(.ccc-shared-icon-control)::after,
  html body #result .card .thumb > .ccc-thumbnail-nav #backToSetBtn:not(.ccc-shared-icon-control)::before,
  html body #result .card .thumb > .ccc-thumbnail-nav #backToSetBtn:not(.ccc-shared-icon-control)::after,
  html body #result .card .thumb > .ccc-thumbnail-nav #nextComicCutBtn:not(.ccc-shared-icon-control)::before,
  html body #result .card .thumb > .ccc-thumbnail-nav #nextComicCutBtn:not(.ccc-shared-icon-control)::after{
    content:none !important;
    display:none !important;
  }

  html body #result .card .thumb > .ccc-thumbnail-nav .material-symbols-outlined{
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:inherit !important;
    font-size:22px !important;
    line-height:1 !important;
  }

  /* Logged-out desktop uses the same 22px glyph scale as Browse List. */
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav .material-symbols-outlined{
    font-size:22px !important;
  }

  html body #result .card .thumb > .ccc-thumbnail-nav button:disabled,
  html body #result .card .thumb > .ccc-thumbnail-nav button[aria-disabled="true"],
  html body #result .card .thumb > .ccc-thumbnail-nav button.is-disabled{
    border-color:rgba(180,184,196,.16) !important;
    background:rgba(112,116,128,.14) !important;
    color:rgba(188,192,204,.42) !important;
    box-shadow:none !important;
    opacity:1 !important;
    filter:grayscale(1) !important;
    cursor:not-allowed !important;
    pointer-events:none !important;
  }


  /* Persistent desktop status/value-highlight badge row beneath the image. */
  #result .card .thumb > .comic-cut-card-counter-slot{
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    min-width:0 !important;
    min-height:30px !important;
    margin:12px 0 0 !important;
    padding:0 !important;
  }

  #result .card .thumb > .comic-cut-card-counter-slot > .comic-cut-nav-counters{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex-wrap:wrap !important;
    width:100% !important;
    gap:6px !important;
    margin:0 !important;
  }

  /* Logged-in member controls form a uniform row directly above navigation. */
  #result .card .thumb > .ccc-desktop-member-card-actions{
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:repeat(3,44px) !important;
    grid-template-rows:44px !important;
    align-items:center !important;
    justify-content:center !important;
    gap:16px !important;
    width:100% !important;
    min-width:0 !important;
    margin:20px 0 0 !important;
    padding:0 !important;
    overflow:visible !important;
  }

  #result .card .thumb > .ccc-desktop-member-card-actions > .comic-cut-main-actions{
    display:contents !important;
  }

  html body #result .card .thumb > .ccc-desktop-member-card-actions .comic-cut-main-actions > .icon-btn{
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 44px !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    margin:0 !important;
    padding:10px !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    background-image:none !important;
    color:var(--text) !important;
    box-shadow:none !important;
    opacity:1 !important;
    overflow:hidden !important;
    cursor:pointer !important;
    transform:none !important;
  }

  html body #result .card .thumb > .ccc-desktop-member-card-actions .comic-cut-main-actions > .icon-btn::before,
  html body #result .card .thumb > .ccc-desktop-member-card-actions .comic-cut-main-actions > .icon-btn::after{
    content:none !important;
    display:none !important;
  }

  html body #result .card .thumb > .ccc-desktop-member-card-actions .material-symbols-outlined{
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:inherit !important;
    font-size:22px !important;
    line-height:1 !important;
  }

  html body #result .card .thumb > .ccc-desktop-member-card-actions .comic-cut-main-actions > .icon-btn:hover:not(:disabled),
  html body #result .card .thumb > .ccc-desktop-member-card-actions .comic-cut-main-actions > .icon-btn:focus-visible{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    background-image:none !important;
    color:#fff !important;
    outline:none !important;
    box-shadow:none !important;
    transform:none !important;
  }

  html body #result .card .thumb > .ccc-desktop-member-card-actions button:disabled,
  html body #result .card .thumb > .ccc-desktop-member-card-actions button[aria-disabled="true"],
  html body #result .card .thumb > .ccc-desktop-member-card-actions button.is-disabled{
    border-color:rgba(180,184,196,.16) !important;
    background:rgba(112,116,128,.14) !important;
    color:rgba(188,192,204,.42) !important;
    box-shadow:none !important;
    opacity:1 !important;
    filter:grayscale(1) !important;
    cursor:not-allowed !important;
    pointer-events:none !important;
  }

  /* Pull Checklist / Previous / Next directly beneath the member controls. */
  #result .card .thumb > .ccc-thumbnail-nav.is-member-thumbnail-nav{
    margin:8px 0 20px !important;
  }

  /* Same style and shared action logic as logged-in mobile Purchase This Card. */
  html body #result .card .desktop-member-info-left > button.ccc-desktop-full-purchase-action,
  html body #result .card .desktop-member-info-left > button.ccc-desktop-full-purchase-action:focus,
  html body #result .card .desktop-member-info-left > button.ccc-desktop-full-purchase-action:focus-visible,
  html body #result .card .desktop-member-info-left > button.ccc-desktop-full-purchase-action:active{
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    display:inline-flex !important;
    visibility:visible !important;
    align-items:center !important;
    justify-content:center !important;
    align-self:center !important;
    width:min(100%,360px) !important;
    min-width:0 !important;
    max-width:360px !important;
    height:38px !important;
    min-height:38px !important;
    max-height:38px !important;
    margin:0 0 12px !important;
    padding:0 14px !important;
    gap:0 !important;
    border:1px solid var(--border) !important;
    border-bottom:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    background-image:none !important;
    color:var(--text) !important;
    opacity:1 !important;
    overflow:hidden !important;
    box-shadow:none !important;
    outline:0 !important;
    transform:none !important;
    text-align:center !important;
    text-decoration:none !important;
    white-space:normal !important;
    cursor:pointer !important;
    pointer-events:auto !important;
    font-size:13px !important;
    font-weight:700 !important;
    line-height:1 !important;
    letter-spacing:.01em !important;
    transition:background .15s ease,border-color .15s ease,color .15s ease !important;
  }

  html body #result .card .desktop-member-info-left > button.ccc-desktop-full-purchase-action::before,
  html body #result .card .desktop-member-info-left > button.ccc-desktop-full-purchase-action::after{
    content:none !important;
    display:none !important;
  }

  html body #result .card .desktop-member-info-left > button.ccc-desktop-full-purchase-action:hover{
    border-color:rgba(255,255,255,.6) !important;
    border-bottom-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    background-image:none !important;
    color:#fff !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
    outline:none !important;
    transform:none !important;
  }

  /* Purchase button (38px) + gap (12px) + Value Highlights (360px). */
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout{
    grid-template-rows:auto 410px !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-left{
    box-sizing:border-box !important;
    display:flex !important;
    flex-direction:column !important;
    grid-column:1 !important;
    grid-row:2 !important;
    height:410px !important;
    min-height:410px !important;
    max-height:410px !important;
    overflow:hidden !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-left > .cc-highlights-panel{
    box-sizing:border-box !important;
    flex:0 0 360px !important;
    height:360px !important;
    min-height:360px !important;
    max-height:360px !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right.ccc-desktop-purchase-column{
    box-sizing:border-box !important;
    grid-column:2 !important;
    grid-row:2 !important;
    height:410px !important;
    min-height:410px !important;
    max-height:410px !important;
    overflow:hidden !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right > .more,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right > .more[style*="display: block"]{
    box-sizing:border-box !important;
    display:block !important;
    height:410px !important;
    min-height:410px !important;
    max-height:410px !important;
    margin:0 !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }
}

/* === SOURCE: 201-public-highlight-slider-modal.css === */
/* Shared Value Highlights carousel for public and logged-in users. Additional Information uses the shared inline panel. */


/* Desktop public comic-cut navigation: exact Browse List control parity.
   This file loads after the other desktop action styles, so this is the
   final cascade owner for the three controls in the thumbnail column. */
@media (min-width:781px){
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav{
    grid-template-columns:repeat(3,44px) !important;
    grid-template-rows:44px !important;
    gap:16px !important;
  }

  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #setChecklistBtn:not(.ccc-shared-icon-control),
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #backToSetBtn:not(.ccc-shared-icon-control),
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #nextComicCutBtn:not(.ccc-shared-icon-control){
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 44px !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    margin:0 !important;
    padding:10px !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:none !important;
    outline:none !important;
    overflow:hidden !important;
    opacity:1 !important;
    transform:none !important;
    transition:background .15s ease,border-color .15s ease,color .15s ease !important;
  }


  /* The visible 54px box came from block 196's nested action-circle, not the button.
     Collapse that wrapper so the outer 44px button is the only painted control. */
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #setChecklistBtn:not(.ccc-shared-icon-control) > .ccc-main-action-circle,
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #backToSetBtn:not(.ccc-shared-icon-control) > .ccc-main-action-circle,
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #nextComicCutBtn:not(.ccc-shared-icon-control) > .ccc-main-action-circle{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 auto !important;
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav .ccc-main-action-label{
    display:none !important;
  }

  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #setChecklistBtn:not(.ccc-shared-icon-control) .material-symbols-outlined,
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #backToSetBtn:not(.ccc-shared-icon-control) .material-symbols-outlined,
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #nextComicCutBtn:not(.ccc-shared-icon-control) .material-symbols-outlined{
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:inherit !important;
    font-size:22px !important;
    line-height:1 !important;
  }

  @media (hover: hover) and (pointer: fine){

  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #setChecklistBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #backToSetBtn:not(.ccc-shared-icon-control):hover:not(:disabled),
html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #nextComicCutBtn:not(.ccc-shared-icon-control):hover:not(:disabled){
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
    box-shadow:none !important;
    outline:none !important;
    transform:none !important;
  }
  }

  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #setChecklistBtn:not(.ccc-shared-icon-control):focus-visible,
html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #backToSetBtn:not(.ccc-shared-icon-control):focus-visible,
html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #nextComicCutBtn:not(.ccc-shared-icon-control):focus-visible{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
    box-shadow:none !important;
    outline:none !important;
    transform:none !important;
  }
}

/* Keep the public desktop navigation visually identical to Random Card. */
@media (min-width:781px){
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav{
    grid-template-columns:repeat(3,44px) !important;
    grid-template-rows:44px !important;
  }

  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #setChecklistBtn:not(.ccc-shared-icon-control),
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #backToSetBtn:not(.ccc-shared-icon-control),
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav #nextComicCutBtn:not(.ccc-shared-icon-control){
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    flex:0 0 44px !important;
    width:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    padding:10px !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    color:var(--text) !important;
    box-shadow:none !important;
    transform:none !important;
  }

  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav .material-symbols-outlined{
    font-size:22px !important;
    line-height:1 !important;
  }
}

.ccc-public-highlight-slider{
  --ccc-slide-accent:var(--cc-highlight-accent, var(--ccg-accent, rgba(154,139,255,.88)));
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate;
  padding:0 !important;
  border:1px solid color-mix(in srgb, var(--ccc-slide-accent) 58%, rgba(255,255,255,.12)) !important;
  border-radius:18px !important;
  background:
    radial-gradient(circle at 16% 16%, color-mix(in srgb, var(--ccc-slide-accent) 28%, transparent), transparent 48%),
    linear-gradient(145deg, color-mix(in srgb, var(--ccc-slide-accent) 20%, rgba(13,14,22,.96)), color-mix(in srgb, var(--ccc-slide-accent) 7%, rgba(8,9,15,.99)) 72%),
    var(--panel) !important;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--ccc-slide-accent) 12%, transparent),
    0 18px 48px color-mix(in srgb, var(--ccc-slide-accent) 10%, transparent) !important;
}

.ccc-public-highlight-slider::before{
  content:"" !important;
  position:absolute !important;
  inset:0 auto 0 0 !important;
  width:4px !important;
  height:auto !important;
  margin:0 !important;
  border-radius:18px 0 0 18px !important;
  background:linear-gradient(180deg, var(--ccc-slide-accent), transparent 82%) !important;
  opacity:.82;
  z-index:4;
  pointer-events:none;
}

.ccc-highlight-slider-header{
  box-sizing:border-box;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-width:0;
  color:rgba(255,255,255,.74);
  text-transform:uppercase;
  letter-spacing:.14em;
}

.ccc-highlight-slider-kicker{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:800;
}

.ccc-highlight-slider-count{
  flex:0 0 auto;
  color:rgba(255,255,255,.52);
  font-variant-numeric:tabular-nums;
}

/* The shared information heading exists in the DOM for resize safety, but is
   intentionally visible only on mobile. */
.ccc-additional-info-header{
  display:none;
  border-bottom:1px solid rgba(255,255,255,.07);
}

.ccc-highlight-slider-viewport{
  position:relative;
  flex:1 1 auto;
  min-width:0;
  min-height:0;
  overflow:hidden;
}

.ccc-public-highlight-slider .ccc-highlight-slide{
  --ccc-card-accent:var(--ccg-accent, var(--cc-highlight-accent, rgba(154,139,255,.88)));
  box-sizing:border-box !important;
  position:absolute !important;
  inset:0 !important;
  display:grid !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:17px !important;
  background:
    radial-gradient(circle at 14% 8%, color-mix(in srgb, var(--ccc-card-accent) 34%, transparent), transparent 46%),
    linear-gradient(150deg, color-mix(in srgb, var(--ccc-card-accent) 18%, transparent), color-mix(in srgb, var(--ccc-card-accent) 5%, transparent) 68%) !important;
  box-shadow:none !important;
  opacity:0;
  visibility:hidden;
  transform:translateX(18px) scale(.985);
  transition:opacity .42s ease, transform .42s ease, visibility 0s linear .42s;
  overflow:hidden;
}

.ccc-public-highlight-slider .ccc-highlight-slide.is-active{
  opacity:1;
  visibility:visible;
  transform:translateX(0) scale(1);
  transition:opacity .42s ease, transform .42s ease;
  z-index:2;
}

.ccc-public-highlight-slider .ccc-highlight-slide > .cc-highlight-icon{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid color-mix(in srgb, var(--ccc-card-accent) 36%, rgba(255,255,255,.08));
  background:color-mix(in srgb, var(--ccc-card-accent) 10%, rgba(255,255,255,.025));
  color:var(--ccc-card-accent) !important;
  box-shadow:0 14px 36px color-mix(in srgb, var(--ccc-card-accent) 14%, transparent);
}

.ccc-public-highlight-slider .ccc-highlight-slide > .cc-highlight-icon .material-symbols-outlined{
  color:inherit !important;
  line-height:1 !important;
}

.ccc-public-highlight-slider .ccc-highlight-slide .cc-highlight-copy{
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:0;
}

.ccc-public-highlight-slider .ccc-highlight-slide .cc-highlight-label{
  color:var(--ccc-card-accent) !important;
  font-weight:850 !important;
  text-transform:uppercase;
  letter-spacing:.08em;
  line-height:1.14 !important;
  overflow-wrap:anywhere;
}

.ccc-public-highlight-slider .ccc-highlight-slide .cc-highlight-value{
  color:#fff !important;
  font-weight:850 !important;
  line-height:1.02 !important;
  width:100%;
  max-width:100%;
  letter-spacing:-.035em;
  overflow-wrap:break-word;
  word-break:normal;
  text-wrap:balance;
}

.ccc-public-highlight-slider .ccc-highlight-number{
  display:block;
  color:#fff !important;
  font-variant-numeric:tabular-nums;
  white-space:nowrap !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
}

.ccc-public-highlight-slider .ccc-highlight-unit{
  display:block;
  margin-top:4px;
  color:#fff !important;
  font-weight:750;
  letter-spacing:.02em;
  line-height:1.15;
}

.ccc-public-highlight-slider .ccc-highlight-slide .cc-highlight-note{
  color:rgba(224,226,238,.78) !important;
  line-height:1.38 !important;
  overflow-wrap:anywhere;
}

.ccc-public-highlight-slider .ccc-highlight-slide .cc-status-owner-group{
  display:grid;
  gap:5px;
}

.ccc-public-highlight-slider .ccc-highlight-slide .cc-status-owner-line{
  display:flex;
  flex-wrap:wrap;
  gap:4px 8px;
  border-bottom:1px solid rgba(255,255,255,.06);
  padding-bottom:4px;
}

.ccc-public-highlight-slider .ccc-highlight-slide .cc-status-owner-title{
  color:var(--ccc-card-accent);
  font-weight:800;
}

.ccc-public-highlight-slider .ccc-highlight-slide .cc-status-owner-name{
  color:#fff !important;
}

.ccc-highlight-slider-dots{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
}

.ccc-highlight-slider-dot{
  appearance:none;
  -webkit-appearance:none;
  width:6px;
  height:6px;
  min-width:6px;
  min-height:6px;
  margin:0;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.22);
  box-shadow:none;
  cursor:pointer;
  transition:width .2s ease, background .2s ease;
}

.ccc-highlight-slider-dot.is-active{
  width:20px;
  background:rgba(255,255,255,.82);
}

/* Desktop public: one tall card fills the existing Value Highlights column. */
@media (min-width:781px){
  #result .card .desktop-member-tall-info-layout.is-logged-out-layout .ccc-public-highlight-slider--desktop,
  #result .card .desktop-member-tall-info-layout.is-logged-in-layout > .desktop-member-info-left > .ccc-public-highlight-slider--desktop{
    width:100% !important;
    height:360px !important;
    min-height:360px !important;
    max-height:360px !important;
    overflow:hidden !important;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slider-header{
    height:44px;
    padding:0 18px;
    font-size:10px;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slider-viewport{
    min-height:0;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide{
    grid-template-columns:66px minmax(0,1fr) !important;
    grid-template-rows:66px minmax(0,1fr) !important;
    align-content:stretch;
    align-items:start;
    justify-items:stretch;
    column-gap:18px;
    row-gap:0;
    padding:25px 28px 22px 31px !important;
    text-align:center;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide > .cc-highlight-icon{
    grid-column:1;
    grid-row:1;
    align-self:start;
    width:66px !important;
    height:66px !important;
    border-radius:20px !important;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide > .cc-highlight-icon .material-symbols-outlined{
    font-size:36px !important;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide .cc-highlight-copy{
    grid-column:2;
    grid-row:1 / span 2;
    align-items:stretch;
    justify-content:flex-start;
    width:100%;
    max-width:none;
    height:100%;
    padding:0;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide .cc-highlight-label{
    box-sizing:border-box;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:66px;
    margin:0;
    padding:0 4px;
    font-size:16px !important;
    max-width:none;
    text-align:center !important;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide .cc-highlight-value{
    position:absolute;
    left:28px;
    right:28px;
    top:56%;
    transform:translateY(-50%);
    width:auto;
    margin:0;
    font-size:clamp(30px, 3.5vw, 52px) !important;
    max-width:none;
    text-align:center !important;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide.ccc-highlight-value-medium .cc-highlight-value{
    font-size:clamp(28px, 2.85vw, 42px) !important;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide.ccc-highlight-value-long .cc-highlight-value{
    font-size:clamp(22px, 2.35vw, 34px) !important;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide.ccc-highlight-value-xlong .cc-highlight-value{
    font-size:clamp(17px, 1.85vw, 26px) !important;
    line-height:1.08 !important;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide.ccc-highlight-has-number .cc-highlight-value{
    font-size:inherit !important;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-number{
    font-size:clamp(58px, 7vw, 88px);
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-unit{
    font-size:16px;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide .cc-highlight-note{
    position:absolute;
    left:28px;
    right:28px;
    bottom:17px;
    width:auto;
    max-width:none;
    max-height:54px;
    margin:0;
    padding:0;
    overflow:auto;
    font-size:13px !important;
    text-align:center !important;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slide.ccc-highlight-has-owner-groups .cc-highlight-value{
    width:100%;
    max-height:118px;
    overflow:auto;
    font-size:15px !important;
    letter-spacing:0;
    text-align:left;
  }

  .ccc-public-highlight-slider--desktop .ccc-highlight-slider-dots{
    height:30px;
    padding:0 14px 10px;
  }
}

/* Mobile: compact horizontal card shared by public and logged-in users. */
@media (max-width:780px){
  /* Put the mobile-only label above the bordered Additional Information box.
     The wrapper and heading remain in normal document flow and never stick. */
  .card .ccc-additional-info-section{
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:6px !important;
  }
  .card .ccc-additional-info-section > .ccc-additional-info-header{
    display:flex !important;
    position:static !important;
    width:100% !important;
    height:30px !important;
    margin:0 !important;
    padding:0 12px !important;
    box-sizing:border-box !important;
    font-size:8px !important;
    flex:0 0 auto !important;
  }

  #result .card .ccc-public-highlight-slider--mobile{
    width:100% !important;
    border-radius:14px !important;
    height:164px !important;
    min-height:164px !important;
    max-height:164px !important;
    margin:0 !important;
    overflow:hidden !important;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slider-header{
    height:30px;
    padding:0 12px;
    font-size:8px;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slide{
    grid-template-columns:54px minmax(0,1fr) !important;
    align-items:center;
    gap:12px;
    padding:12px 13px 10px 15px !important;
    text-align:left;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slide > .cc-highlight-icon{
    width:52px !important;
    height:52px !important;
    border-radius:16px !important;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slide > .cc-highlight-icon .material-symbols-outlined{
    font-size:29px !important;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slide .cc-highlight-copy{
    justify-content:center;
    overflow:hidden;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slide .cc-highlight-label{
    font-size:11px !important;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slide .cc-highlight-value{
    margin-top:5px;
    font-size:clamp(19px, 5.8vw, 27px) !important;
  }

  /* Short displayed text values, such as the value shown beneath IP, get the
     same large mobile scale as numeric highlights. Values over 15 characters
     continue to use the existing medium/long/xlong sizing below. */
  .ccc-public-highlight-slider--mobile .ccc-highlight-slide.ccc-highlight-mobile-number-size .cc-highlight-value{
    font-size:clamp(34px, 10vw, 46px) !important;
    line-height:1 !important;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slide.ccc-highlight-value-medium .cc-highlight-value{
    font-size:clamp(17px, 5vw, 22px) !important;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slide.ccc-highlight-value-long .cc-highlight-value{
    font-size:clamp(14px, 4.3vw, 18px) !important;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slide.ccc-highlight-value-xlong .cc-highlight-value{
    font-size:clamp(12px, 3.8vw, 15px) !important;
    line-height:1.08 !important;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-number{
    display:inline;
    font-size:clamp(34px, 10vw, 46px);
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-unit{
    display:inline;
    margin:0 0 0 7px;
    font-size:12px;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slide .cc-highlight-note{
    margin-top:5px;
    max-height:32px;
    overflow:auto;
    font-size:10px !important;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slide.ccc-highlight-has-owner-groups .cc-highlight-value{
    max-height:58px;
    overflow:auto;
    font-size:11px !important;
    letter-spacing:0;
  }

  .ccc-public-highlight-slider--mobile .ccc-highlight-slider-dots{
    height:22px;
    padding:0 10px 7px;
  }

  /* Keep the public page as the only vertical scroller. The compact slider
     used small nested overflow areas that could consume the first upward swipe.
     Clamp those short text regions instead and explicitly preserve vertical page
     panning while retaining the slider's JavaScript horizontal swipe gesture. */
  #result .card .ccc-public-highlight-slider--mobile,
  #result .card .ccc-public-highlight-slider--mobile .ccc-highlight-slider-viewport,
  #result .card .ccc-public-highlight-slider--mobile .ccc-highlight-slide,
  #result .card .ccc-public-highlight-slider--mobile .cc-highlight-copy{
    touch-action:pan-y !important;
    overscroll-behavior-y:auto !important;
  }

  #result .card .ccc-public-highlight-slider--mobile .cc-highlight-note{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    max-height:32px !important;
    overflow:hidden !important;
    overscroll-behavior:auto !important;
  }

  #result .card .ccc-public-highlight-slider--mobile .ccc-highlight-slide.ccc-highlight-has-owner-groups .cc-highlight-value{
    max-height:58px !important;
    overflow:hidden !important;
    overscroll-behavior:auto !important;
  }

  #result .card.ccc-public-mobile-card .altthumbs-wrap,
  #result .card.ccc-public-mobile-card .altthumbs-wrap .altthumbs,
  #result .card.ccc-public-mobile-card .altthumbs-wrap .altthumb,
  #result .card.ccc-public-mobile-card .altthumbs-wrap .altthumb img{
    touch-action:pan-x pan-y !important;
    overscroll-behavior-y:auto !important;
  }

}

@media (max-width:480px){
  .card .ccc-additional-info-section > .ccc-additional-info-header{
    margin-left:0 !important;
    margin-right:0 !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .ccc-public-highlight-slider .ccc-highlight-slide{
    transition:none !important;
  }
}

/* Collector Status: owner-first centered value layout shared by public/member desktop and mobile. */
.cc-highlights-panel .cc-highlight-collector-status .cc-highlight-value{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-wrap:wrap !important;
  gap:8px 18px !important;
  text-align:center !important;
}

.cc-highlights-panel .cc-highlight-collector-status .cc-status-owner-group{
  display:contents !important;
}

.cc-highlights-panel .cc-highlight-collector-status .cc-status-owner-line{
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:0 !important;
  max-width:100% !important;
  gap:5px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  text-align:center !important;
}

.cc-highlights-panel .cc-highlight-collector-status .cc-status-owner-name{
  display:block !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  color:#fff !important;
  font-weight:900 !important;
  line-height:1 !important;
  letter-spacing:-.035em !important;
  text-align:center !important;
  width:100% !important;
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
  transition:none !important;
  transform:none !important;
  filter:none !important;
  cursor:default !important;
}

.cc-highlights-panel .cc-highlight-collector-status .cc-status-owner-title{
  display:block !important;
  color:var(--ccc-card-accent, var(--ccg-accent, rgba(154,139,255,.88))) !important;
  font-weight:850 !important;
  line-height:1.1 !important;
  letter-spacing:.08em !important;
  text-align:center !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
}

@media (min-width:781px){
  .ccc-public-highlight-slider--desktop .cc-highlight-collector-status .cc-highlight-value{
    left:28px !important;
    right:28px !important;
    top:55% !important;
    width:auto !important;
    max-height:none !important;
    overflow:visible !important;
    border-bottom:0 !important;
    font-size:inherit !important;
  }

  /* Collector Status uses one centered metric per active status. A divider is
     created only between two real statuses, so a lone PC value has no trailing
     line underneath or beside it. */
  .ccc-public-highlight-slider--desktop .cc-highlight-collector-status .cc-status-inline{
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    min-width:0 !important;
    gap:clamp(12px, 2vw, 22px) !important;
    text-align:center !important;
  }

  .ccc-public-highlight-slider--desktop .cc-highlight-collector-status .cc-status-inline-metric{
    display:inline-flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    text-align:center !important;
    white-space:nowrap !important;
  }

  .ccc-public-highlight-slider--desktop .cc-highlight-collector-status .cc-status-inline-separator{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 auto !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    font-size:clamp(28px, 3.5vw, 46px) !important;
    font-weight:700 !important;
    line-height:1 !important;
  }

  .ccc-public-highlight-slider--desktop .cc-highlight-collector-status .cc-status-owner-name{
    font-size:clamp(32px, 4.6vw, 62px) !important;
  }

  .ccc-public-highlight-slider--desktop .cc-highlight-collector-status .cc-status-owner-title{
    font-size:14px !important;
  }

  .ccc-public-highlight-slider--desktop .cc-highlight-collector-status.ccc-highlight-has-multiple-owners .cc-status-owner-line{
    flex:1 1 180px !important;
  }

  .ccc-public-highlight-slider--desktop .cc-highlight-collector-status.ccc-highlight-has-multiple-owners .cc-status-owner-name{
    font-size:clamp(19px, 2.35vw, 31px) !important;
  }

  .ccc-public-highlight-slider--desktop .cc-highlight-collector-status.ccc-highlight-has-multiple-owners .cc-status-owner-title{
    font-size:11px !important;
  }

  .ccc-public-highlight-slider--desktop .cc-highlight-collector-status.ccc-highlight-has-many-owners .cc-status-owner-name{
    font-size:clamp(15px, 1.75vw, 24px) !important;
  }

  .ccc-public-highlight-slider--desktop .cc-highlight-collector-status.ccc-highlight-has-many-owners .cc-status-owner-title{
    font-size:9px !important;
  }
}

@media (max-width:780px){
  /* Match Sets Featuring This Issue: the Collector Status heading always starts
     on the left. A single status follows that same left edge; multiple statuses
     may center as a group for balance. */
  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status .cc-highlight-copy{
    align-items:flex-start !important;
    text-align:left !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status .cc-highlight-label{
    width:100% !important;
    justify-content:flex-start !important;
    text-align:left !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status .cc-highlight-value,
  #result .card .ccc-public-highlight-slider--mobile .cc-highlight-collector-status.ccc-highlight-has-owner-groups .cc-highlight-value{
    width:100% !important;
    max-height:64px !important;
    margin-top:6px !important;
    overflow:hidden !important;
    font-size:inherit !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status .cc-status-inline{
    box-sizing:border-box !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:baseline !important;
    width:100% !important;
    min-width:0 !important;
    gap:8px !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status.ccc-highlight-status-single .cc-highlight-value,
  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status.ccc-highlight-status-single .cc-status-inline{
    justify-content:flex-start !important;
    text-align:left !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status.ccc-highlight-status-multiple .cc-highlight-value,
  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status.ccc-highlight-status-multiple .cc-status-inline{
    justify-content:center !important;
    text-align:center !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status .cc-status-inline-metric{
    display:inline-flex !important;
    flex-direction:row !important;
    align-items:baseline !important;
    justify-content:flex-start !important;
    min-width:0 !important;
    gap:7px !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    white-space:nowrap !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status .cc-status-inline-metric .ccc-highlight-number,
  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status .cc-status-inline-metric .ccc-highlight-unit{
    display:inline !important;
    margin:0 !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status .cc-status-inline-separator{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 auto !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    font-size:clamp(20px, 6vw, 28px) !important;
    font-weight:700 !important;
    line-height:1 !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status .cc-status-owner-name{
    font-size:clamp(19px, 6vw, 30px) !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status .cc-status-owner-title{
    font-size:10px !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status.ccc-highlight-has-multiple-owners .cc-highlight-value{
    gap:5px 10px !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status.ccc-highlight-has-multiple-owners .cc-status-owner-line{
    flex:1 1 44% !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status.ccc-highlight-has-multiple-owners .cc-status-owner-name{
    font-size:clamp(12px, 3.8vw, 18px) !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status.ccc-highlight-has-multiple-owners .cc-status-owner-title{
    font-size:8px !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status.ccc-highlight-has-many-owners .cc-status-owner-name{
    font-size:clamp(10px, 3.1vw, 14px) !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-collector-status.ccc-highlight-has-many-owners .cc-status-owner-title{
    font-size:7px !important;
  }
}



/* Keep the active highlight's assigned tint visible while hover pauses the carousel. */
@media (hover: hover) and (pointer: fine){
.ccc-public-highlight-slider .ccc-highlight-slide.is-active:hover{
  background:
    radial-gradient(circle at 14% 8%, color-mix(in srgb, var(--ccc-card-accent) 34%, transparent), transparent 46%),
    linear-gradient(150deg, color-mix(in srgb, var(--ccc-card-accent) 18%, transparent), color-mix(in srgb, var(--ccc-card-accent) 5%, transparent) 68%) !important;
  transform:translateX(0) scale(1) !important;
  box-shadow:none !important;
}
}
.ccc-public-highlight-slider .ccc-highlight-slide.is-active:focus-within{
  background:
    radial-gradient(circle at 14% 8%, color-mix(in srgb, var(--ccc-card-accent) 34%, transparent), transparent 46%),
    linear-gradient(150deg, color-mix(in srgb, var(--ccc-card-accent) 18%, transparent), color-mix(in srgb, var(--ccc-card-accent) 5%, transparent) 68%) !important;
  transform:translateX(0) scale(1) !important;
  box-shadow:none !important;
}

@media (hover: hover) and (pointer: fine){

.ccc-public-highlight-slider .cc-highlight-collector-status .cc-status-owner-name:hover,
.ccc-public-highlight-slider .cc-highlight-issue-specialist-award .cc-specialist-owner-name:hover{
  color:#fff !important;
  text-decoration:none !important;
  transform:none !important;
  filter:none !important;
  cursor:default !important;
}
}

@media (hover: hover) and (pointer: fine){

.ccc-public-highlight-slider .cc-highlight-collector-status .cc-status-owner-title:hover{
  color:var(--ccc-card-accent, var(--ccg-accent, rgba(154,139,255,.88))) !important;
  text-decoration:none !important;
  transform:none !important;
  filter:none !important;
  cursor:default !important;
}
}

@media (hover: hover) and (pointer: fine){

.ccc-public-highlight-slider .cc-highlight-issue-specialist-award .cc-specialist-cut-count:hover{
  color:rgba(255,214,90,.98) !important;
  text-decoration:none !important;
  transform:none !important;
  filter:none !important;
  cursor:default !important;
}
}

.cc-highlights-panel .cc-highlight-issue-specialist-award .cc-highlight-value{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  text-align:center !important;
}

.cc-highlights-panel .cc-highlight-issue-specialist-award .cc-specialist-owner-line{
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  gap:5px !important;
  margin:0 !important;
  padding:0 !important;
  text-align:center !important;
}

.cc-highlights-panel .cc-highlight-issue-specialist-award .cc-specialist-owner-name{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  color:#fff !important;
  font-weight:900 !important;
  line-height:1 !important;
  letter-spacing:-.035em !important;
  text-align:center !important;
  white-space:nowrap !important;
  overflow:visible !important;
  text-overflow:clip !important;
  transition:none !important;
  transform:none !important;
  filter:none !important;
  cursor:default !important;
}

.cc-highlights-panel .cc-highlight-issue-specialist-award .cc-specialist-cut-count{
  display:block !important;
  color:rgba(255,214,90,.98) !important;
  font-weight:850 !important;
  line-height:1.1 !important;
  letter-spacing:.08em !important;
  text-align:center !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
  transition:none !important;
  transform:none !important;
  filter:none !important;
  cursor:default !important;
}

@media (min-width:781px){
  .ccc-public-highlight-slider--desktop .cc-highlight-issue-specialist-award .cc-highlight-value{
    left:28px !important;
    right:28px !important;
    top:55% !important;
    width:auto !important;
    font-size:inherit !important;
  }

  .ccc-public-highlight-slider--desktop .cc-highlight-issue-specialist-award .cc-specialist-owner-name{
    font-size:clamp(32px, 4.6vw, 62px) !important;
  }

  .ccc-public-highlight-slider--desktop .cc-highlight-issue-specialist-award .cc-specialist-cut-count{
    font-size:14px !important;
  }
}

@media (max-width:780px){
  .ccc-public-highlight-slider--mobile .cc-highlight-issue-specialist-award .cc-highlight-copy{
    align-items:center !important;
    text-align:center !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-issue-specialist-award .cc-highlight-label{
    width:100% !important;
    text-align:center !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-issue-specialist-award .cc-highlight-value{
    width:100% !important;
    max-height:64px !important;
    margin-top:6px !important;
    overflow:hidden !important;
    font-size:inherit !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-issue-specialist-award .cc-specialist-owner-name{
    font-size:clamp(19px, 6vw, 30px) !important;
  }

  .ccc-public-highlight-slider--mobile .cc-highlight-issue-specialist-award .cc-specialist-cut-count{
    font-size:10px !important;
  }
}

/* === SOURCE: 146-browse-list-final-width-match-random-card.css === */
/*
  Shared icon-control component.
  Browse List and the three Comic Cut navigation controls use the exact same box model.
*/
html body #listBtn.ccc-shared-icon-control,
html body #comicCutNav #setChecklistBtn.ccc-shared-icon-control,
html body #comicCutNav #backToSetBtn.ccc-shared-icon-control,
html body #comicCutNav #nextComicCutBtn.ccc-shared-icon-control {
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  flex:0 0 44px !important;
  width:44px !important;
  min-width:44px !important;
  max-width:44px !important;
  height:44px !important;
  min-height:44px !important;
  max-height:44px !important;
  margin:0 !important;
  padding:10px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid var(--border) !important;
  border-radius:10px !important;
  background:var(--panel) !important;
  background-image:none !important;
  color:var(--text) !important;
  opacity:1 !important;
  outline:none !important;
  box-shadow:none !important;
  transform:none !important;
  overflow:hidden !important;
  cursor:pointer !important;
  text-decoration:none !important;
  transition:background .15s ease,border-color .15s ease,color .15s ease !important;
}

@media (hover: hover) and (pointer: fine) {

html body #listBtn.ccc-shared-icon-control:hover:not(:disabled),
html body #comicCutNav #setChecklistBtn.ccc-shared-icon-control:hover:not(:disabled),
html body #comicCutNav #backToSetBtn.ccc-shared-icon-control:hover:not(:disabled),
html body #comicCutNav #nextComicCutBtn.ccc-shared-icon-control:hover:not(:disabled) {
  border-color:rgba(255,255,255,.6) !important;
  background:rgba(255,255,255,.08) !important;
  background-image:none !important;
  color:#fff !important;
  opacity:1 !important;
  outline:none !important;
  box-shadow:none !important;
  transform:none !important;
}
}

html body #listBtn.ccc-shared-icon-control:focus-visible,
html body #comicCutNav #setChecklistBtn.ccc-shared-icon-control:focus-visible,
html body #comicCutNav #backToSetBtn.ccc-shared-icon-control:focus-visible,
html body #comicCutNav #nextComicCutBtn.ccc-shared-icon-control:focus-visible {
  border-color:rgba(255,255,255,.6) !important;
  background:rgba(255,255,255,.08) !important;
  background-image:none !important;
  color:#fff !important;
  opacity:1 !important;
  outline:none !important;
  box-shadow:none !important;
  transform:none !important;
}

html body #listBtn.ccc-shared-icon-control:active,
html body #comicCutNav #setChecklistBtn.ccc-shared-icon-control:active,
html body #comicCutNav #backToSetBtn.ccc-shared-icon-control:active,
html body #comicCutNav #nextComicCutBtn.ccc-shared-icon-control:active {
  transform:none !important;
}

html body #comicCutNav #setChecklistBtn.ccc-shared-icon-control:disabled,
html body #comicCutNav #backToSetBtn.ccc-shared-icon-control:disabled,
html body #comicCutNav #nextComicCutBtn.ccc-shared-icon-control:disabled {
  opacity:1 !important;
  border:1px solid var(--border) !important;
  border-radius:10px !important;
  background:var(--panel) !important;
  background-image:none !important;
  color:var(--text) !important;
  box-shadow:none !important;
  cursor:default !important;
}

html body #listBtn.ccc-shared-icon-control::before,
html body #listBtn.ccc-shared-icon-control::after,
html body #comicCutNav #setChecklistBtn.ccc-shared-icon-control::before,
html body #comicCutNav #setChecklistBtn.ccc-shared-icon-control::after,
html body #comicCutNav #backToSetBtn.ccc-shared-icon-control::before,
html body #comicCutNav #backToSetBtn.ccc-shared-icon-control::after,
html body #comicCutNav #nextComicCutBtn.ccc-shared-icon-control::before,
html body #comicCutNav #nextComicCutBtn.ccc-shared-icon-control::after {
  content:none !important;
  display:none !important;
}

html body .ccc-shared-icon-control > .ccc-main-action-circle {
  display:contents !important;
}
html body .ccc-shared-icon-control > .ccc-main-action-label {
  display:none !important;
}

html body #listBtn.ccc-shared-icon-control .material-symbols-outlined,
html body #comicCutNav #setChecklistBtn.ccc-shared-icon-control .material-symbols-outlined,
html body #comicCutNav #backToSetBtn.ccc-shared-icon-control .material-symbols-outlined,
html body #comicCutNav #nextComicCutBtn.ccc-shared-icon-control .material-symbols-outlined {
  display:block !important;
  flex:0 0 auto !important;
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:inherit !important;
  box-shadow:none !important;
  line-height:1 !important;
  opacity:1 !important;
}

/* The Manage Search glyph has more built-in whitespace than Shuffle.
   Enlarge only the glyph; the shared 44px control box remains unchanged. */
html body #listBtn.ccc-shared-icon-control .material-symbols-outlined {
  font-size:26px !important;
}

html body #comicCutNav #setChecklistBtn.ccc-shared-icon-control .material-symbols-outlined,
html body #comicCutNav #backToSetBtn.ccc-shared-icon-control .material-symbols-outlined,
html body #comicCutNav #nextComicCutBtn.ccc-shared-icon-control .material-symbols-outlined {
  font-size:22px !important;
}

html body #comicCutNav #setChecklistBtn.ccc-shared-icon-control:disabled .material-symbols-outlined,
html body #comicCutNav #backToSetBtn.ccc-shared-icon-control:disabled .material-symbols-outlined,
html body #comicCutNav #nextComicCutBtn.ccc-shared-icon-control:disabled .material-symbols-outlined {
  opacity:.42 !important;
}

/* Browse List stays visibly selected for the full time its panel is open. */
html body #listBtn.ccc-shared-icon-control.is-active,
html body #listBtn.ccc-shared-icon-control[aria-pressed="true"],
html body.browse-list-open #listBtn.ccc-shared-icon-control {
  border-color:rgba(255,255,255,.6) !important;
  background:rgba(255,255,255,.08) !important;
  background-image:none !important;
  color:#fff !important;
  opacity:1 !important;
  outline:none !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  transform:none !important;
}

/* Desktop Browse List only: 360px x 1.30 = 468px. Normal search suggestions
   and the mobile viewport-sized panel keep their existing heights. */
@media (min-width:781px) {
  html body.browse-list-open #ac.ac {
    max-height:468px !important;
  }
}

/* === SOURCE: 202-nav-spacing-purchase-pagination-refinements.css === */
/* Requested UI refinements: tighter nav spacing, desktop purchase placement, and mobile pager parity. */

@media (min-width:781px){
  /* Reduce the empty space below Previous / Checklist / Next for both login states. */
  html body #result .card .thumb > .ccc-thumbnail-nav,
  html body #result .card .thumb > .ccc-thumbnail-nav.is-member-thumbnail-nav,
  html body #result .card .thumb > .ccc-thumbnail-nav.is-public-thumbnail-nav{
    margin-bottom:6px !important;
  }

  /* Logged-in desktop only: Purchase This Card now sits below the nav row. */
  html body #result .card .thumb > button.ccc-desktop-full-purchase-action,
  html body #result .card .thumb > button.ccc-desktop-full-purchase-action:focus,
  html body #result .card .thumb > button.ccc-desktop-full-purchase-action:focus-visible,
  html body #result .card .thumb > button.ccc-desktop-full-purchase-action:active{
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    align-self:center !important;
    width:min(100%,360px) !important;
    min-width:0 !important;
    max-width:360px !important;
    height:38px !important;
    min-height:38px !important;
    max-height:38px !important;
    margin:0 auto 8px !important;
    padding:0 14px !important;
    border:1px solid var(--border) !important;
    border-radius:10px !important;
    background:var(--panel) !important;
    background-image:none !important;
    color:var(--text) !important;
    box-shadow:none !important;
    outline:0 !important;
    transform:none !important;
    text-align:center !important;
    text-decoration:none !important;
    cursor:pointer !important;
    font-size:13px !important;
    font-weight:700 !important;
    line-height:1 !important;
  }
  html body #result .card .thumb > button.ccc-desktop-full-purchase-action:hover{
    border-color:rgba(255,255,255,.6) !important;
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.60) !important;
  }

  /* The purchase button no longer consumes space above Value Highlights. */
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout{
    grid-template-rows:auto 360px !important;
  }
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-left,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right.ccc-desktop-purchase-column,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right > .more,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right > .more[style*="display: block"]{
    height:360px !important;
    min-height:360px !important;
    max-height:360px !important;
  }
}

@media (max-width:780px){
  /* Reduce the empty space below the three-button nav on logged-out mobile. */
  html body #result .card.ccc-public-mobile-card > .thumb > .ccc-public-thumb-nav--mobile{
    margin-bottom:4px !important;
  }

  /* Reduce the same gap for logged-in mobile without moving its controls. */
  html body #result .card.ccc-logged-in-card .comic-cut-card-action-stack{
    margin-bottom:0 !important;
    padding-bottom:0 !important;
  }
  html body #result .card.ccc-logged-in-card .comic-cut-card-action-stack > #comicCutNav.comic-cut-nav.is-visible,
  html body #result .card.ccc-logged-in-card .comic-cut-card-action-stack > #comicCutNav.ccc-logged-in-checklist-mode.comic-cut-nav.is-visible{
    margin-bottom:0 !important;
  }

  /* The next full-width mobile row also carried its own top margin. Tighten it
     so the visible space beneath navigation is reduced in both login states. */
  html body #result .card .card-main > .altthumbs-wrap--master-mobile-placement,
  html body #result .card .card-main > .altthumbs-wrap--mobile-1cc-toggle,
  html body #result .card .card-main > .ccc-public-mobile-value-nav-panels{
    margin-top:4px !important;
  }
}

/* === SOURCE: 203-collectors-vault-card.css === */
/* Search on the Web: frosted comic-image glass action card. */

.ccc-collector-vault-section{
  box-sizing:border-box !important;
  font-family:inherit !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:6px !important;
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
}

.ccc-collector-vault-section-header{
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  width:100% !important;
  min-width:0 !important;
  height:30px !important;
  min-height:30px !important;
  margin:0 !important;
  padding:0 12px !important;
  color:rgba(255,255,255,.74) !important;
  font-family:inherit !important;
  font-size:8px !important;
  font-weight:800 !important;
  letter-spacing:.14em !important;
  line-height:normal !important;
  text-transform:uppercase !important;
}

.ccc-collector-vault-section-header > .ccc-highlight-slider-kicker{
  font-family:inherit !important;
  font-size:inherit !important;
  font-weight:800 !important;
  letter-spacing:inherit !important;
  line-height:normal !important;
  text-transform:inherit !important;
}

.ccc-collector-vault-card,
.ccc-collector-vault-card:focus,
.ccc-collector-vault-card:focus-visible,
.ccc-collector-vault-card:active{
  appearance:none !important;
  -webkit-appearance:none !important;
  box-sizing:border-box !important;
  display:flex !important;
  position:relative !important;
  isolation:isolate !important;
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  border:0 !important;
  border-radius:18px !important;
  background:
    linear-gradient(135deg, rgba(245,247,250,.075), rgba(184,192,204,.032) 52%, rgba(17,19,25,.38)),
    rgba(14,16,22,.92) !important;
  color:#fff !important;
  box-shadow:0 12px 28px rgba(0,0,0,.22) !important;
  outline:0 !important;
  font-family:inherit !important;
  text-align:left !important;
  text-decoration:none !important;
  cursor:pointer !important;
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:transparent !important;
  transform:translateZ(0) !important;
  transition:transform .24s cubic-bezier(.2,.75,.25,1), box-shadow .24s ease, background .24s ease !important;
}

.ccc-collector-vault-card::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  border-radius:inherit !important;
  background:
    linear-gradient(120deg, rgba(255,255,255,.07), rgba(255,255,255,.018) 42%, rgba(185,193,205,.032) 72%, rgba(255,255,255,.01)) !important;
  backdrop-filter:blur(1.8px) saturate(.72) !important;
  -webkit-backdrop-filter:blur(1.8px) saturate(.72) !important;
  opacity:.74 !important;
  pointer-events:none !important;
  transition:opacity .24s ease, background .24s ease !important;
}

.ccc-collector-vault-image-bg{
  position:absolute !important;
  inset:-5% !important;
  z-index:0 !important;
  display:block !important;
  background-position:center 34% !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  opacity:.12 !important;
  filter:grayscale(.12) saturate(.7) contrast(.9) brightness(.92) !important;
  transform:scale(1.03) !important;
  transition:transform .42s cubic-bezier(.2,.75,.25,1), opacity .28s ease, filter .28s ease !important;
  pointer-events:none !important;
}

.ccc-collector-vault-card:not(.ccc-vault-has-image) .ccc-collector-vault-image-bg{
  opacity:0 !important;
}

.ccc-collector-vault-card:hover{
  border:0 !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.105), rgba(195,202,213,.04) 52%, rgba(18,20,27,.34)),
    rgba(16,18,24,.93) !important;
  color:#fff !important;
  box-shadow:0 18px 38px rgba(0,0,0,.30), 0 0 24px rgba(235,239,245,.09) !important;
  transform:translateY(-2px) scale(1.008) translateZ(0) !important;
}

.ccc-collector-vault-card:hover::before{
  opacity:1 !important;
  background:
    linear-gradient(120deg, rgba(255,255,255,.095), rgba(255,255,255,.026) 40%, rgba(197,204,214,.042) 73%, rgba(255,255,255,.014)) !important;
}

.ccc-collector-vault-card:hover .ccc-collector-vault-image-bg{
  opacity:.20 !important;
  filter:grayscale(.06) saturate(.82) contrast(.94) brightness(.98) !important;
  transform:scale(1.10) !important;
}

.ccc-collector-vault-card:active{
  transform:translateY(0) scale(.992) translateZ(0) !important;
  transition-duration:.09s !important;
}

.ccc-collector-vault-card:focus-visible{
  border:0 !important;
  box-shadow:0 18px 38px rgba(0,0,0,.30), 0 0 26px rgba(255,255,255,.10) !important;
  outline:0 !important;
}

.ccc-collector-vault-card > span,
.ccc-collector-vault-card .material-symbols-outlined{
  pointer-events:none !important;
}

.ccc-collector-vault-body{
  box-sizing:border-box !important;
  display:grid !important;
  position:relative !important;
  z-index:2 !important;
  flex:1 1 auto !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  align-items:center !important;
  width:100% !important;
  min-width:0 !important;
}

.ccc-collector-vault-icon,
.ccc-collector-vault-balance{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
}

.ccc-collector-vault-icon{
  border:0 !important;
  background:rgba(255,255,255,.10) !important;
  color:#fff !important;
  box-shadow:0 4px 14px rgba(0,0,0,.16) !important;
  backdrop-filter:blur(5px) !important;
  -webkit-backdrop-filter:blur(5px) !important;
  transition:transform .24s cubic-bezier(.2,.75,.25,1), background .24s ease !important;
}

.ccc-collector-vault-card:hover .ccc-collector-vault-icon{
  background:rgba(255,255,255,.16) !important;
  transform:scale(1.08) rotate(-5deg) !important;
}

.ccc-collector-vault-icon .material-symbols-outlined{
  display:block !important;
  color:#fff !important;
  line-height:1 !important;
}

.ccc-collector-vault-copy{
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:baseline !important;
  justify-content:center !important;
  gap:8px !important;
  min-width:0 !important;
  width:100% !important;
  overflow:hidden !important;
  white-space:nowrap !important;
  text-align:center !important;
}

.ccc-collector-vault-name{
  display:block !important;
  flex:0 1 auto !important;
  min-width:0 !important;
  max-width:100% !important;
  overflow:hidden !important;
  color:#fff !important;
  font-weight:900 !important;
  letter-spacing:-.02em !important;
  line-height:1 !important;
  text-align:center !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
  text-shadow:0 2px 10px rgba(0,0,0,.52) !important;
  transition:letter-spacing .24s ease, transform .24s ease !important;
}

.ccc-collector-vault-serial{
  display:block !important;
  flex:0 0 auto !important;
  min-width:0 !important;
  overflow:visible !important;
  color:rgba(255,255,255,.72) !important;
  font-weight:750 !important;
  letter-spacing:.04em !important;
  line-height:1 !important;
  text-align:left !important;
  white-space:nowrap !important;
  text-shadow:0 2px 8px rgba(0,0,0,.48) !important;
}

.ccc-collector-vault-serial.is-empty{
  display:none !important;
}

.ccc-collector-vault-card.ccc-vault-no-serial .ccc-collector-vault-name{
  text-align:center !important;
}

.ccc-collector-vault-card:hover .ccc-collector-vault-name{
  letter-spacing:-.005em !important;
  transform:scale(1.015) !important;
}

@media (min-width:781px){
  /* 360px Value Highlights + 10px gap + 30px heading + 6px gap + 56px Vault card. */
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-out-layout{
    grid-template-rows:auto 462px !important;
    align-items:stretch !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .ccc-desktop-summary-actions,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-out-layout > .ccc-desktop-summary-actions{
    grid-column:1 / -1 !important;
    grid-row:1 !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-left,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-out-layout > .desktop-member-info-left{
    box-sizing:border-box !important;
    display:flex !important;
    flex-direction:column !important;
    grid-column:1 !important;
    grid-row:2 !important;
    gap:10px !important;
    width:100% !important;
    height:462px !important;
    min-height:462px !important;
    max-height:462px !important;
    overflow:hidden !important;
  }

  #result .card .desktop-member-info-left > .ccc-collector-vault-section--desktop{
    flex:0 0 92px !important;
    height:92px !important;
    min-height:92px !important;
    max-height:92px !important;
  }

  #result .card .desktop-member-info-left > .ccc-collector-vault-section--desktop > .ccc-collector-vault-card--desktop{
    height:56px !important;
    min-height:56px !important;
    max-height:56px !important;
  }

  #result .card .desktop-member-info-left > .ccc-public-highlight-slider--desktop{
    flex:0 0 360px !important;
    height:360px !important;
    min-height:360px !important;
    max-height:360px !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-out-layout > .desktop-member-info-right{
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:minmax(0,1fr) !important;
    grid-column:2 !important;
    grid-row:2 !important;
    align-self:stretch !important;
    width:100% !important;
    height:462px !important;
    min-height:0 !important;
    max-height:462px !important;
    overflow:hidden !important;
  }

  #result .card .desktop-member-info-right > .ccc-additional-info-section--desktop{
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:30px minmax(0,1fr) !important;
    align-self:stretch !important;
    gap:6px !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:hidden !important;
  }

  #result .card .desktop-member-info-right > .ccc-additional-info-section--desktop > .ccc-additional-info-header{
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    width:100% !important;
    height:30px !important;
    min-height:30px !important;
    margin:0 !important;
    padding:0 12px !important;
    color:rgba(255,255,255,.74) !important;
    font-size:10px !important;
    font-weight:800 !important;
    letter-spacing:.14em !important;
    line-height:1 !important;
    text-transform:uppercase !important;
  }

  #result .card .desktop-member-info-right > .ccc-additional-info-section--desktop > .more,
  #result .card .desktop-member-info-right > .ccc-additional-info-section--desktop > .more[style*="display: block"]{
    box-sizing:border-box !important;
    display:block !important;
    align-self:stretch !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    max-height:100% !important;
    margin:0 !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }

  .ccc-collector-vault-card--desktop .ccc-collector-vault-body{
    grid-template-columns:34px minmax(0,1fr) 34px !important;
    gap:10px !important;
    padding:6px 14px !important;
  }

  .ccc-collector-vault-card--desktop .ccc-collector-vault-icon,
  .ccc-collector-vault-card--desktop .ccc-collector-vault-balance{
    width:34px !important;
    min-width:34px !important;
    height:34px !important;
  }

  .ccc-collector-vault-card--desktop .ccc-collector-vault-icon{
    border-radius:11px !important;
  }

  .ccc-collector-vault-card--desktop .ccc-collector-vault-icon .material-symbols-outlined{
    font-size:21px !important;
  }

  .ccc-collector-vault-section--desktop > .ccc-collector-vault-section-header{
    font-size:10px !important;
  }

  .ccc-collector-vault-card--desktop .ccc-collector-vault-name{
    font-size:19px !important;
  }

  .ccc-collector-vault-card--desktop .ccc-collector-vault-serial{
    font-size:10px !important;
  }
}

@media (max-width:780px){
  .ccc-collector-vault-section--mobile{
    gap:3px !important;
  }

  #result .card .details-panels > .ccc-collector-vault-section--mobile,
  #result .card .ccc-public-mobile-value-nav-panels > .ccc-collector-vault-section--mobile{
    width:100% !important;
    min-width:0 !important;
  }

  #result .card .ccc-collector-vault-section--mobile > .ccc-collector-vault-card--mobile{
    width:100% !important;
    height:68px !important;
    min-height:68px !important;
    max-height:68px !important;
    border-radius:14px !important;
  }

  .ccc-collector-vault-card--mobile .ccc-collector-vault-body{
    grid-template-columns:32px minmax(0,1fr) 32px !important;
    gap:8px !important;
    padding:8px 10px !important;
  }

  .ccc-collector-vault-card--mobile .ccc-collector-vault-icon,
  .ccc-collector-vault-card--mobile .ccc-collector-vault-balance{
    width:32px !important;
    min-width:32px !important;
    height:32px !important;
  }

  .ccc-collector-vault-card--mobile .ccc-collector-vault-icon{
    border-radius:12px !important;
  }

  .ccc-collector-vault-card--mobile .ccc-collector-vault-icon .material-symbols-outlined{
    font-size:20px !important;
  }

  .ccc-collector-vault-card--mobile .ccc-collector-vault-copy{
    gap:6px !important;
  }

  .ccc-collector-vault-card--mobile .ccc-collector-vault-name{
    font-size:15px !important;
  }

  .ccc-collector-vault-card--mobile .ccc-collector-vault-serial{
    font-size:8px !important;
  }

}

@media (max-width:780px) and (hover:none){
  .ccc-collector-vault-card:hover{
    box-shadow:0 12px 28px rgba(0,0,0,.22) !important;
    transform:translateZ(0) !important;
  }
  .ccc-collector-vault-card:hover .ccc-collector-vault-image-bg{
    opacity:.12 !important;
    transform:scale(1.03) !important;
  }
  .ccc-collector-vault-card:hover .ccc-collector-vault-icon,
  .ccc-collector-vault-card:hover .ccc-collector-vault-name{
    transform:none !important;
  }
}

/* === SOURCE: 204-desktop-logged-in-additional-info-height-parity.css === */
/* Desktop logged-in only: keep Additional Information level with the bottom of Value Highlights. */
@media (min-width:781px){
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right.ccc-desktop-purchase-column{
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:minmax(0,1fr) !important;
    align-self:stretch !important;
    width:100% !important;
    height:462px !important;
    min-height:462px !important;
    max-height:462px !important;
    overflow:hidden !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right > .ccc-additional-info-section--desktop{
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:30px 426px !important;
    align-self:stretch !important;
    gap:6px !important;
    width:100% !important;
    height:462px !important;
    min-height:462px !important;
    max-height:462px !important;
    margin:0 !important;
    overflow:hidden !important;
  }

  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right > .ccc-additional-info-section--desktop > .more,
  #result .card .desktop-member-tall-info-layout.ccc-desktop-summary-layout.is-logged-in-layout > .desktop-member-info-right > .ccc-additional-info-section--desktop > .more[style*="display: block"]{
    box-sizing:border-box !important;
    display:block !important;
    align-self:stretch !important;
    width:100% !important;
    height:426px !important;
    min-height:426px !important;
    max-height:426px !important;
    margin:0 !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }
}

/* === SOURCE: 205-found-cuts-view.css === */
/* Found Cuts view under Comic Cut Tools */
.found-cuts-summary{
  max-width:none;
  margin:0 0 6px;
  color:var(--muted);
  font-size:13px;
  line-height:1.35;
  text-align:center;
}

.found-cuts-note{
  max-width:920px;
  margin:0 auto 14px;
  padding:9px 12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(154,139,255,.08);
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
  text-align:center;
}

.found-cuts-list{
  display:grid;
  gap:12px;
  width:100%;
  max-width:1120px;
  margin:0 auto;
  padding:0 2px 20px;
}

.found-cuts-item{
  display:grid;
  grid-template-columns:minmax(210px,.95fr) minmax(300px,1.35fr) minmax(230px,.9fr);
  gap:14px;
  align-items:center;
  padding:14px;
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.035);
  box-shadow:0 10px 28px rgba(0,0,0,.12);
}

.found-cuts-info{
  min-width:0;
}

.found-cuts-issue{
  font-size:16px;
  font-weight:850;
  line-height:1.28;
  overflow-wrap:anywhere;
}

.found-cuts-meta{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  align-items:center;
  margin-top:8px;
}

.found-cuts-subset,
.found-cuts-card-number{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:4px 8px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.18);
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  line-height:1.2;
}

.found-cuts-card-number{
  color:var(--text);
}

.found-cuts-file-input{
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
}

.found-cuts-upload{
  min-height:116px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  padding:14px;
  border:2px dashed rgba(255,255,255,.24);
  background:rgba(0,0,0,.14);
  color:var(--text);
  cursor:pointer;
  text-align:center;
  transition:border-color .16s ease, background .16s ease, transform .16s ease, opacity .16s ease;
  touch-action:manipulation;
}

.found-cuts-upload .material-symbols-outlined{
  font-size:31px;
}

.found-cuts-upload strong{
  font-size:13px;
}

.found-cuts-upload > span:last-child{
  color:var(--muted);
  font-size:11px;
}

.found-cuts-upload:hover,
.found-cuts-upload:focus-visible,
.found-cuts-upload.is-dragover{
  border-color:rgba(154,139,255,.95);
  background:rgba(154,139,255,.12);
  outline:none;
  transform:translateY(-1px);
}

.found-cuts-upload.has-files{
  border-style:solid;
  border-color:rgba(154,139,255,.65);
}

.found-cuts-upload.is-busy{
  opacity:.62;
  pointer-events:none;
  transform:none;
}

.found-cuts-actions{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.found-cuts-previews{
  display:flex;
  gap:7px;
  min-height:0;
  overflow-x:auto;
  padding:1px 1px 4px;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
}

.found-cuts-preview-chip{
  position:relative;
  width:66px;
  flex:0 0 66px;
}

.found-cuts-preview-chip img{
  display:block;
  width:66px;
  height:66px;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.25);
}

.found-cuts-preview-name{
  display:block;
  margin-top:4px;
  overflow:hidden;
  color:var(--muted);
  font-size:9px;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.found-cuts-preview-remove{
  position:absolute;
  top:3px;
  right:3px;
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.38);
  border-radius:999px;
  background:rgba(0,0,0,.78);
  color:#fff;
  cursor:pointer;
}

.found-cuts-preview-remove .material-symbols-outlined{
  font-size:16px;
}

.found-cuts-status{
  min-height:18px;
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
}

.found-cuts-status.ok{
  color:#77e49b;
}

.found-cuts-status.err{
  color:#ff8d8d;
}

.found-cuts-submit{
  width:100%;
  min-height:44px;
  justify-content:center;
}

@media (max-width:780px){
  .found-cuts-note{
    margin-bottom:10px;
    text-align:left;
  }

  .found-cuts-list{
    gap:10px;
    padding-inline:0;
  }

  .found-cuts-item{
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    padding:12px;
  }

  .found-cuts-issue{
    font-size:15px;
  }

  .found-cuts-upload{
    min-height:108px;
    padding:13px 10px;
  }

  .found-cuts-preview-chip,
  .found-cuts-preview-chip img{
    width:72px;
    flex-basis:72px;
  }

  .found-cuts-preview-chip img{
    height:72px;
  }

  .found-cuts-submit{
    min-height:50px;
    font-size:15px;
  }
}

@media (max-width:420px){
  .found-cuts-item{
    padding:10px;
  }

  .found-cuts-meta{
    gap:5px;
  }

  .found-cuts-subset,
  .found-cuts-card-number{
    min-height:24px;
    padding:4px 7px;
    font-size:10px;
  }
}

/* Compact comic issue cover shown with each Tracking Comic Cuts row */
.found-cuts-info{
  display:grid;
  grid-template-columns:64px minmax(0,1fr);
  gap:11px;
  align-items:center;
}

.found-cuts-info-copy{
  min-width:0;
}

.found-cuts-issue-thumb{
  width:64px;
  aspect-ratio:2 / 3;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.22);
  box-shadow:0 5px 14px rgba(0,0,0,.18);
}

.found-cuts-issue-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  background:rgba(0,0,0,.2);
}

.found-cuts-issue-thumb.is-empty{
  color:var(--muted);
}

.found-cuts-issue-thumb.is-empty .material-symbols-outlined{
  font-size:26px;
  opacity:.72;
}

@media (max-width:780px){
  .found-cuts-info{
    grid-template-columns:58px minmax(0,1fr);
    gap:10px;
  }

  .found-cuts-issue-thumb{
    width:58px;
  }
}

@media (max-width:420px){
  .found-cuts-info{
    grid-template-columns:52px minmax(0,1fr);
    gap:9px;
  }

  .found-cuts-issue-thumb{
    width:52px;
  }
}


/* Paired reference images: imagecomic cover + master cut image */
.found-cuts-info{
  grid-template-columns:auto minmax(0,1fr);
}

.found-cuts-reference-images{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}

.found-cuts-reference-thumb{
  width:52px;
  aspect-ratio:2 / 3;
  display:grid;
  place-items:center;
  flex:0 0 52px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.22);
  box-shadow:0 5px 14px rgba(0,0,0,.18);
}

.found-cuts-reference-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  background:rgba(0,0,0,.2);
}

.found-cuts-reference-thumb.is-empty{
  color:var(--muted);
}

.found-cuts-reference-thumb.is-empty .material-symbols-outlined{
  font-size:23px;
  opacity:.72;
}

@media (max-width:780px){
  .found-cuts-reference-images{
    gap:6px;
  }

  .found-cuts-reference-thumb{
    width:46px;
    flex-basis:46px;
  }
}

@media (max-width:420px){
  .found-cuts-info{
    gap:8px;
  }

  .found-cuts-reference-images{
    gap:5px;
  }

  .found-cuts-reference-thumb{
    width:42px;
    flex-basis:42px;
  }

  .found-cuts-reference-thumb.is-empty .material-symbols-outlined{
    font-size:20px;
  }
}

/* === SOURCE: 206-mobile-hide-my-collection-search-action.css === */
/* Mobile only: remove the My Collection shortcut beside the search bar
   and its separator. Desktop behavior remains unchanged. */
@media (max-width: 780px) {
  #myCollectionMineBtn,
  #mcSeparator {
    display: none !important;
  }
}

/* === SOURCE: 207-mobile-topbar-centered-logo.css === */
/* Mobile-only spacing and content rules. The centered topbar logo itself is
   shared with desktop in the base stylesheet. */
@media (max-width: 780px) {
  /* Keep the same 56px bar height while reclaiming a little internal room. */
  .topbar {
    padding: 2px 16px !important;
  }

  /* Remove the old mobile logo, Checklist label, and Comic Cut Finder title. */
  body > .container > header.page {
    display: none !important;
  }

  /* Keep a 20px gap between the fixed top bar and the search controls. */
  body > .container {
    padding-top: 12px !important;
  }

  body > .container > .searchwrap {
    padding-top: 8px !important;
    margin-top: 0 !important;
  }

  /* Reduce the current search-to-slider spacing by 25%. */
  .new-sets-viewport {
    margin-top: 8.25px !important;
  }

  .result,
  #result .empty {
    margin-top: 11px !important;
  }

  /* When an actual search result is displayed, add a little more breathing
     room below the search controls without changing the home slider gap.
     Structural wrappers such as the Set Checklist scroll shell should not
     receive that spacing themselves; apply it to the first real content row
     inside the shell so Comic Books and Checklist begin at the same Y position. */
  #result > :first-child:not(.empty):not(.set-checklist-scroll-shell),
  #result > .set-checklist-scroll-shell:first-child > :first-child:not(.empty) {
    margin-top: 9px !important;
  }
}

@media (max-width: 480px) {
  .new-sets-viewport {
    margin-top: 6.75px !important;
  }
}

/* === SOURCE: 208-global-disabled-button-state.css === */
/* Global disabled-button visual state.
   Loaded last and given enough specificity to override older component rules. */
html body button:disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b),
html body button[aria-disabled="true"]:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b),
html body button.is-disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b),
html body button.disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b),
html body [role="button"][aria-disabled="true"]:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b),
html body a[aria-disabled="true"]:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b){
  cursor: not-allowed !important;
  pointer-events: none !important;
  opacity: .62 !important;
  filter: grayscale(1) saturate(.15) !important;
  color: rgba(224, 225, 230, .72) !important;
  border-color: rgba(170, 173, 184, .38) !important;
  background: rgba(92, 95, 106, .48) !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Some navigation controls are transparent wrappers around the actual visible
   circle. Gray the circle and label as part of the same disabled state. */
html body button:disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .ccc-main-action-circle,
html body button[aria-disabled="true"]:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .ccc-main-action-circle,
html body button.is-disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .ccc-main-action-circle,
html body button.disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .ccc-main-action-circle{
  background: rgba(92, 95, 106, .62) !important;
  border-color: rgba(170, 173, 184, .38) !important;
  color: rgba(224, 225, 230, .68) !important;
  box-shadow: none !important;
  filter: grayscale(1) saturate(.15) !important;
  transform: none !important;
}

html body button:disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .ccc-main-action-label,
html body button[aria-disabled="true"]:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .ccc-main-action-label,
html body button.is-disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .ccc-main-action-label,
html body button.disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .ccc-main-action-label,
html body button:disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .material-symbols-outlined,
html body button[aria-disabled="true"]:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .material-symbols-outlined,
html body button.is-disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .material-symbols-outlined,
html body button.disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b) .material-symbols-outlined{
  color: rgba(224, 225, 230, .62) !important;
  opacity: 1 !important;
}

/* The desktop circular toolbar uses transparent outer wrappers. Keep those
   wrappers transparent while the inner visible circle carries the gray state. */
html body .ccc-main-quick-actions button:disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b),
html body .ccc-main-quick-actions button[aria-disabled="true"]:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b),
html body .ccc-main-quick-actions button.is-disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b),
html body .ccc-main-quick-actions button.disabled:not(#ccc-disabled-state-a):not(#ccc-disabled-state-b){
  background: transparent !important;
}

/* === SOURCE: 211-set-gallery-by-owner.css === */
/* Logged-in Set Gallery: owner grouping only.
   Card/grid sizing deliberately comes from the existing .mini-results/.mini-row
   and .ccc-mobile-pager rules so Gallery matches My Collection and Comic Books. */
.view-toggle-btn[aria-pressed="true"]{
  font-weight:800 !important;
}

.set-gallery-owner-header{
  margin-bottom:0 !important;
}

.set-gallery-owner-body{
  width:100%;
  min-width:0;
}

.set-gallery-owner-body > .mini-results{
  margin-top:10px;
}

.set-gallery-empty{
  text-align:center;
  margin:18px auto 8px;
}

@media (max-width:780px){
  .set-gallery-owner-body > .ccc-mobile-pager{
    margin:10px 0 4px !important;
  }
}


/* Desktop Set Gallery structural width lock.
   Every owner header/body must occupy the same full #result track. The owner
   body is also attached before its mini-grid is created in JS, preventing
   content-sized/intrinsic owner grids and leading blank columns. */
@media (min-width:781px) and (hover:hover) and (pointer:fine){
  #result > .set-gallery-owner-header,
  #result > .set-gallery-owner-body{
    grid-column:1 / -1 !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    justify-self:stretch !important;
    box-sizing:border-box !important;
  }

  #result .set-gallery-owner-grid{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    justify-self:stretch !important;
    grid-auto-flow:row dense !important;
    align-items:start !important;
    justify-items:stretch !important;
    box-sizing:border-box !important;
  }

  #result .set-gallery-owner-grid > .mini-row{
    grid-column:auto !important;
    grid-row:auto !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:0 !important;
  }
}

/* === SOURCE: 212-desktop-dual-images-mobile-browse-neutral.css === */
/* Mobile Browse/Archive touch-state correction only. */
@media (max-width:780px){
  /* Mobile Safari can retain synthetic :hover/:focus/:active after the Archive
     button changes the view. Keep every transient interaction state neutral. */
  html body #listBtn.ccc-shared-icon-control,
  html body #listBtn.ccc-shared-icon-control:hover,
  html body #listBtn.ccc-shared-icon-control:focus,
  html body #listBtn.ccc-shared-icon-control:focus-visible,
  html body #listBtn.ccc-shared-icon-control:active,
  html body #listBtn.ccc-shared-icon-control.is-active,
  html body #listBtn.ccc-shared-icon-control[aria-pressed="true"],
  html body.browse-list-open #listBtn.ccc-shared-icon-control{
    border-color:var(--border) !important;
    background:var(--panel) !important;
    background-image:none !important;
    color:var(--text) !important;
    opacity:1 !important;
    outline:none !important;
    box-shadow:none !important;
    transform:none !important;
  }
}


/* === 20260827 quick add + mobile flag-up final overrides === */
.ccc-add-quick-add-section{
  grid-column: 1 / -1;
}
.ccc-add-quick-add-body{
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: start;
}
.ccc-add-quick-add-body > *{
  min-width: 0;
}
.ccc-add-quick-add-body .image-upload-actions .auth-btn{
  min-width: 0;
  flex: 1 1 110px;
}
@media (max-width: 780px){
  .ccc-add-quick-add-body{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .ccc-add-quick-add-body .form-field{
    padding: 10px 8px;
  }
  .ccc-add-quick-add-body .image-upload-dropzone{
    padding: 10px;
  }
  .ccc-add-quick-add-body .image-upload-actions{
    gap: 6px;
  }

  #addCardOverlay.open,
  #editCardOverlay.open{
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    top: var(--ccc-mobile-popup-top, 56px) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    padding: 0 !important;
    background: rgba(0,0,0,.62) !important;
    z-index: 99999 !important;
    overflow: hidden !important;
  }

  #addCardModal,
  #editCardModal{
    position: fixed !important;
    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    max-height: calc(100dvh - var(--ccc-mobile-popup-top, 56px)) !important;
    margin: 0 !important;
    transform: none !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
    border-left: 0 !important;
    border-radius: 18px 18px 0 0 !important;
    box-shadow: 0 24px 70px rgba(0,0,0,.45) !important;
    z-index: 100000 !important;
  }

  #addCardModal.open,
  #editCardModal.open{
    display: flex !important;
    flex-direction: column !important;
  }
}


/* === 20260827 quick add SN-on-card + upload cleanup === */
/* Quick Add keeps the proven uploader controls, but uses compact Front/Back labels. */
.ccc-add-quick-add-body .ccc-quick-add-image-field .image-upload-help{
  display:none !important;
}

/* File storage paths are internal details; keep previews/actions but hide path strings everywhere. */
.image-upload-path{
  display:none !important;
}


/* === 20260827 nested Add/Edit mobile dropdown picker === */
/* Reuse the existing shared mobile picker as a second-level flag-up over Add/Edit. */
.ccc-mobile-picker-header{
  min-width:0;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:10px;
}
.ccc-mobile-picker-header .ccc-mobile-picker-title{
  min-width:0;
  padding:0 2px 1px;
}
.ccc-mobile-picker-back-btn{
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  padding:6px 9px 6px 7px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:10px;
  background:rgba(255,255,255,.055);
  color:var(--text);
  font:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}
.ccc-mobile-picker-back-btn .material-symbols-outlined{
  font-size:18px;
  line-height:1;
}
@media (max-width:780px){
  /* Nested form flag-ups use z-index 100000. Only their child picker is promoted
     above that layer; every other mobile picker keeps its existing z-index. */
  .ccc-mobile-picker-overlay.ccc-mobile-picker-overlay--nested-modal{
    z-index:100100 !important;
    background:rgba(0,0,0,.52) !important;
  }
  .ccc-mobile-picker-sheet.ccc-mobile-picker-sheet--nested-modal{
    z-index:100110 !important;
  }
}

/* === 20260829 mobile-only transient button highlight release fix ===
   Touch Safari can retain :hover after a tap. Keep the real :active press
   feedback, but return Home, Random, Previous, and Next to their resting
   appearance as soon as the finger is released. Desktop is untouched. */
@media (max-width:780px) and (hover:none) and (pointer:coarse){
  /* Search-row Home + Random Card. :not(:active) preserves the normal tap flash. */
  html body #listBtn:hover:not(:active),
  html body #listBtn:focus:not(:focus-visible):not(:active),
  html body #myCollectionBtn:hover:not(:active),
  html body #myCollectionBtn:focus:not(:focus-visible):not(:active){
    border-color:var(--border) !important;
    background:var(--panel) !important;
    background-image:none !important;
    color:var(--text) !important;
    opacity:1 !important;
    outline:none !important;
    box-shadow:none !important;
    transform:none !important;
  }

  /* Mobile Full Detail Previous/Next outer button returns to its normal wrapper. */
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #backToSetBtn:hover:not(:active),
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #backToSetBtn:focus:not(:focus-visible):not(:active),
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #nextComicCutBtn:hover:not(:active),
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #nextComicCutBtn:focus:not(:focus-visible):not(:active){
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    outline:none !important;
    transform:none !important;
  }

  /* This is the visible circle from the video. Reset only after release;
     the existing :active rule still lights it while the finger is down. */
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #backToSetBtn:hover:not(:active) .ccc-main-action-circle,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #backToSetBtn:focus:not(:focus-visible):not(:active) .ccc-main-action-circle,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #nextComicCutBtn:hover:not(:active) .ccc-main-action-circle,
  html body #result .card.ccc-mobile-full-detail-card .ccc-mobile-full-action-row #nextComicCutBtn:focus:not(:focus-visible):not(:active) .ccc-main-action-circle{
    border-color:rgba(255,255,255,.16) !important;
    background:rgba(255,255,255,.075) !important;
    box-shadow:none !important;
    transform:none !important;
  }
}

/* === SOURCE: 219-mobile-add-edit-keyboard-focus-visibility.css === */
/* Shared mobile Add/Edit keyboard behavior. The JS controller measures the live
   focused field after every VisualViewport change. It also gives the modal body
   enough temporary scroll range to clear the iOS keyboard even when Quick Add or
   any other form section is collapsed. Desktop and nested dropdown flag-ups are
   unchanged. */
@media (max-width:780px){
  #addCardModal .modal-body,
  #editCardModal .modal-body{
    --ccc-add-edit-keyboard-clearance:0px;
    scroll-padding-top:14px !important;
    scroll-padding-bottom:22px !important;
  }

  #addCardModal.ccc-mobile-keyboard-active .modal-body,
  #editCardModal.ccc-mobile-keyboard-active .modal-body{
    padding-bottom:calc(12px + var(--ccc-add-edit-keyboard-clearance, 0px)) !important;
    scroll-padding-bottom:calc(22px + var(--ccc-add-edit-keyboard-clearance, 0px)) !important;
  }

  #addCardModal.ccc-mobile-keyboard-active .form-field,
  #editCardModal.ccc-mobile-keyboard-active .form-field{
    scroll-margin-top:14px;
    scroll-margin-bottom:22px;
  }
}

/* === SOURCE: 220-mobile-add-edit-dedicated-screen.css === */
/* Mobile Add/Edit is a dedicated viewport screen, not a popup/flag-up. The
   existing modal DOM/form is reused so validation, uploads, dropdowns, save,
   remove, permissions, and desktop behavior stay on the existing code path.
   On mobile, the screen itself is pinned to the live visual viewport: the
   header and action bar never enter the scroll region, and only .modal-body
   scrolls between them. */
@media (max-width:780px), (hover:none) and (pointer:coarse){
  html.ccc-mobile-add-edit-screen-open{
    width:100% !important;
    height:100% !important;
    overflow:hidden !important;
    overscroll-behavior:none !important;
    background:#0e0f12 !important;
  }

  body.ccc-mobile-add-edit-screen-open{
    position:static !important;
    inset:auto !important;
    width:100% !important;
    min-height:100% !important;
    height:100% !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    overscroll-behavior:none !important;
    background:#0e0f12 !important;
  }

  /* The dedicated form screen replaces the normal app chrome while it is open. */
  body.ccc-mobile-add-edit-screen-open > .topbar,
  body.ccc-mobile-add-edit-screen-open > .container,
  body.ccc-mobile-add-edit-screen-open > #site-footer,
  body.ccc-mobile-add-edit-screen-open > #flyoutOverlay,
  body.ccc-mobile-add-edit-screen-open > #leftFlyout,
  body.ccc-mobile-add-edit-screen-open > #rightFlyout,
  body.ccc-mobile-add-edit-screen-open > #protipPopupOverlay,
  body.ccc-mobile-add-edit-screen-open > #privacyOverlay,
  body.ccc-mobile-add-edit-screen-open > #privacyModal,
  body.ccc-mobile-add-edit-screen-open > #cccMobileScrollTopBtn,
  body.ccc-mobile-add-edit-screen-open > .modal-overlay,
  body.ccc-mobile-add-edit-screen-open > #addCardOverlay,
  body.ccc-mobile-add-edit-screen-open > #editCardOverlay{
    display:none !important;
  }

  /* Only the active Add/Edit screen participates in the viewport shell. */
  body.ccc-mobile-add-edit-screen-open > .modal:not(.ccc-mobile-form-screen){
    display:none !important;
  }

  #addCardModal.ccc-mobile-form-screen,
  #editCardModal.ccc-mobile-form-screen{
    position:fixed !important;
    top:var(--ccc-mobile-form-screen-top, 0px) !important;
    right:auto !important;
    bottom:auto !important;
    left:0 !important;
    transform:none !important;
    display:flex !important;
    flex-direction:column !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    height:var(--ccc-mobile-form-screen-height, 100dvh) !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:#0e0f12 !important;
    background-image:none !important;
    z-index:2200 !important;
    box-sizing:border-box !important;
  }

  /* Header/back control is outside the scrolling body, so it remains pinned. */
  #addCardModal.ccc-mobile-form-screen > header,
  #editCardModal.ccc-mobile-form-screen > header{
    position:relative !important;
    top:auto !important;
    flex:0 0 auto !important;
    z-index:3 !important;
    display:grid !important;
    grid-template-columns:76px minmax(0, 1fr) 76px !important;
    align-items:center !important;
    width:100% !important;
    min-height:calc(56px + env(safe-area-inset-top, 0px)) !important;
    padding:calc(6px + env(safe-area-inset-top, 0px)) 10px 6px !important;
    border:0 !important;
    border-bottom:1px solid var(--border) !important;
    background:#101114 !important;
    background-image:none !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    box-shadow:0 4px 14px rgba(0,0,0,.22) !important;
    box-sizing:border-box !important;
  }

  #addCardModal.ccc-mobile-form-screen > header > strong,
  #editCardModal.ccc-mobile-form-screen > header > strong{
    grid-column:2 !important;
    grid-row:1 !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 4px !important;
    overflow:hidden !important;
    text-align:center !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    font-size:15px !important;
    font-weight:800 !important;
    letter-spacing:.01em !important;
  }

  #addCardModal.ccc-mobile-form-screen .ccc-mobile-form-screen-back,
  #editCardModal.ccc-mobile-form-screen .ccc-mobile-form-screen-back{
    grid-column:1 !important;
    grid-row:1 !important;
    justify-self:start !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:3px !important;
    width:auto !important;
    min-width:0 !important;
    height:42px !important;
    padding:0 4px !important;
    border-color:transparent !important;
    background:transparent !important;
    box-shadow:none !important;
    color:var(--text) !important;
  }

  #addCardModal.ccc-mobile-form-screen .ccc-mobile-form-screen-back .material-symbols-outlined,
  #editCardModal.ccc-mobile-form-screen .ccc-mobile-form-screen-back .material-symbols-outlined{
    font-size:24px !important;
  }

  .ccc-mobile-form-screen-back-label{
    font-size:13px !important;
    font-weight:700 !important;
    line-height:1 !important;
  }

  #addCardModal.ccc-mobile-form-screen > header::after,
  #editCardModal.ccc-mobile-form-screen > header::after{
    content:'';
    grid-column:3;
    grid-row:1;
    width:76px;
    height:1px;
  }

  /* This is the one and only Add/Edit scroll region on mobile. */
  #addCardModal.ccc-mobile-form-screen .modal-body,
  #editCardModal.ccc-mobile-form-screen .modal-body{
    display:block !important;
    flex:1 1 0% !important;
    width:100% !important;
    min-height:0 !important;
    height:auto !important;
    max-height:none !important;
    padding:14px 12px 20px !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior-y:contain !important;
    -webkit-overflow-scrolling:touch !important;
    scroll-padding-top:14px !important;
    scroll-padding-bottom:22px !important;
    box-sizing:border-box !important;
  }

  #addCardModal.ccc-mobile-form-screen .form-grid,
  #editCardModal.ccc-mobile-form-screen .form-grid{
    width:100% !important;
    max-width:720px !important;
    margin:0 auto !important;
    min-width:0 !important;
  }

  #addCardModal.ccc-mobile-form-screen .form-field,
  #editCardModal.ccc-mobile-form-screen .form-field,
  #addCardModal.ccc-mobile-form-screen input,
  #editCardModal.ccc-mobile-form-screen input,
  #addCardModal.ccc-mobile-form-screen textarea,
  #editCardModal.ccc-mobile-form-screen textarea,
  #addCardModal.ccc-mobile-form-screen select,
  #editCardModal.ccc-mobile-form-screen select{
    scroll-margin-top:14px !important;
    scroll-margin-bottom:22px !important;
  }

  /* Cancel / Save / Remove is a non-scrolling bottom action bar. */
  #addCardModal.ccc-mobile-form-screen .modal-footer,
  #editCardModal.ccc-mobile-form-screen .modal-footer{
    position:relative !important;
    bottom:auto !important;
    flex:0 0 auto !important;
    z-index:3 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:12px 12px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    border-top:1px solid var(--border) !important;
    background:#101114 !important;
    box-shadow:0 -4px 14px rgba(0,0,0,.22) !important;
    box-sizing:border-box !important;
  }

  #addCardModal.ccc-mobile-form-screen .card-modal-actions,
  #editCardModal.ccc-mobile-form-screen .card-modal-actions{
    width:100% !important;
    max-width:720px !important;
    margin:0 auto !important;
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr) !important;
    gap:8px !important;
  }

  #addCardModal.ccc-mobile-form-screen .card-modal-actions{
    grid-template-areas:
      "save save"
      "cancel cancel" !important;
  }

  #editCardModal.ccc-mobile-form-screen .card-modal-actions{
    grid-template-areas:
      "remove save"
      "cancel cancel" !important;
  }

  #addCardModal.ccc-mobile-form-screen .card-modal-actions > button,
  #editCardModal.ccc-mobile-form-screen .card-modal-actions > button{
    width:100% !important;
    min-width:0 !important;
  }

  #addCardModal.ccc-mobile-form-screen .card-modal-save,
  #editCardModal.ccc-mobile-form-screen .card-modal-save{ grid-area:save !important; }
  #editCardModal.ccc-mobile-form-screen .card-modal-remove{ grid-area:remove !important; }
  #addCardModal.ccc-mobile-form-screen .card-modal-cancel,
  #editCardModal.ccc-mobile-form-screen .card-modal-cancel{ grid-area:cancel !important; }

  #addCardModal.ccc-mobile-form-screen .modal-msg,
  #editCardModal.ccc-mobile-form-screen .modal-msg{
    width:100% !important;
    max-width:720px !important;
    min-height:0 !important;
    margin:0 auto !important;
    text-align:center !important;
  }

  /* The live VisualViewport controller scrolls .modal-body when the keyboard is
     present. Keep its clearance variable available without moving the pinned
     header or footer. */
  #addCardModal.ccc-mobile-form-screen.ccc-mobile-keyboard-active .modal-body,
  #editCardModal.ccc-mobile-form-screen.ccc-mobile-keyboard-active .modal-body{
    padding-bottom:calc(20px + var(--ccc-add-edit-keyboard-clearance, 0px)) !important;
    scroll-padding-bottom:calc(22px + var(--ccc-add-edit-keyboard-clearance, 0px)) !important;
  }
}



/* === 20260830 shared page/control corrections === */
.ccs-page{
  width:100%;
  max-width:100%;
  min-width:0;
  display:grid;
  gap:16px;
}
.request-membership-outside{
  width:100%;
  margin:0;
  justify-content:center;
}
.price-guide-filterbar{
  gap:10px;
}
.price-guide-clear-filter-btn{
  flex:0 0 44px;
  width:44px !important;
  min-width:44px !important;
  height:44px !important;
  padding:0 !important;
}
.price-guide-clear-filter-btn:disabled{
  opacity:.42 !important;
  cursor:default !important;
  pointer-events:none !important;
}

/* Top-row Home and Random use real press feedback instead of sticky touch hover.
   Desktop hover remains unchanged; mobile returns to rest immediately on release. */
.searchwrap > #listBtn.icon-btn:active,
.searchwrap > #myCollectionBtn.icon-btn:active{
  border-color:rgba(255,255,255,.80) !important;
  background:rgba(255,255,255,.12) !important;
  color:#fff !important;
}
@media (max-width:780px) and (hover:none) and (pointer:coarse){
  html body .searchwrap > #listBtn.icon-btn:hover:not(:active),
  html body .searchwrap > #listBtn.icon-btn:focus:not(:active),
  html body .searchwrap > #listBtn.icon-btn:focus-visible:not(:active),
  html body .searchwrap > #myCollectionBtn.icon-btn:hover:not(:active),
  html body .searchwrap > #myCollectionBtn.icon-btn:focus:not(:active),
  html body .searchwrap > #myCollectionBtn.icon-btn:focus-visible:not(:active){
    border-color:var(--border) !important;
    background:var(--panel) !important;
    background-image:none !important;
    color:var(--text) !important;
    outline:none !important;
    box-shadow:none !important;
  }
  html body .searchwrap > #listBtn.icon-btn:active,
  html body .searchwrap > #myCollectionBtn.icon-btn:active{
    border-color:rgba(255,255,255,.80) !important;
    background:rgba(255,255,255,.12) !important;
    color:#fff !important;
  }
  .price-guide-filterbar{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 44px !important;
    align-items:center !important;
    gap:8px !important;
  }
  .price-guide-filterbar > .price-guide-filter-desktop{
    display:none !important;
  }
  .price-guide-filterbar > .price-guide-mobile-filter{
    grid-column:1 !important;
    width:100% !important;
  }
  .price-guide-filterbar > .price-guide-clear-filter-btn{
    grid-column:2 !important;
    margin:0 !important;
  }
}


/* === SOURCE: 224-bulletin-board.css === */
/* Bulletin Board: authenticated bounty requests + Trade/Sale member gallery. */
.bulletin-board-page{
  width:100%;
  max-width:100%;
  min-width:0;
  display:grid;
  gap:14px;
}
.bulletin-bounty-action-wrap{
  display:flex;
  justify-content:center;
  width:100%;
}
.bulletin-bounty-action{
  width:min(360px,100%) !important;
  min-height:44px;
  justify-content:center;
  font-weight:800;
}
.bulletin-section-title{
  margin:4px 0 2px;
  color:var(--text);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.bulletin-bounty-scroller{
  --bulletin-bounty-card-height:124px;
  --bulletin-bounty-gap:10px;
  --bulletin-bounty-peek:28px;
  width:100%;
  max-width:100%;
  min-width:0;
  max-height:calc((var(--bulletin-bounty-card-height) * 2) + (var(--bulletin-bounty-gap) * 2) + var(--bulletin-bounty-peek));
  overflow-x:hidden;
  overflow-y:auto;
  padding:3px 5px 3px 2px;
  overscroll-behavior-x:none;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  scrollbar-width:thin;
  scrollbar-gutter:stable;
  overflow-anchor:none;
}
.bulletin-bounty-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  grid-auto-flow:row;
  gap:var(--bulletin-bounty-gap);
  width:100%;
  max-width:100%;
  min-width:0;
  align-items:stretch;
}
.bulletin-bounty-card{
  position:relative;
  box-sizing:border-box;
  width:100%;
  max-width:100%;
  min-width:0;
  height:var(--bulletin-bounty-card-height);
}
.bulletin-bounty-contact{
  box-sizing:border-box;
  width:100%;
  max-width:100%;
  min-width:0;
  height:100%;
  display:grid;
  grid-template-columns:92px minmax(0,1fr);
  align-items:stretch;
  gap:8px;
  overflow:hidden;
  padding:8px;
  border:1px solid var(--border);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  color:var(--text);
  font:inherit;
  text-align:center;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(0,0,0,.16);
}
.bulletin-bounty-contact:hover,
.bulletin-bounty-contact:focus-visible{
  border-color:rgba(255,255,255,.48);
  outline:none;
}
.bulletin-bounty-contact:focus-visible{
  box-shadow:0 0 0 3px var(--focus-ring),0 10px 24px rgba(0,0,0,.16);
}
.bulletin-bounty-contact:disabled{
  cursor:default;
  opacity:.62;
}
.bulletin-bounty-image{
  box-sizing:border-box;
  width:92px;
  height:100%;
  min-height:0;
  display:block;
  object-fit:contain;
  border-radius:9px;
  background:rgba(0,0,0,.18);
}
.bulletin-bounty-image-ph{
  box-sizing:border-box;
  width:92px;
  height:100%;
  min-height:0;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:rgba(0,0,0,.18);
  color:var(--muted);
}
.bulletin-bounty-image-ph .material-symbols-outlined{font-size:30px;}
.bulletin-bounty-copy{
  min-width:0;
  max-width:100%;
  display:grid;
  align-content:center;
  justify-items:center;
  gap:0;
  padding:2px 4px;
  overflow:hidden;
  text-align:center;
}
.bulletin-bounty-heading-row{
  width:100%;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin-bottom:8px;
}
.bulletin-bounty-details{
  width:100%;
  min-width:0;
  display:grid;
  justify-items:center;
  gap:3px;
}
.bulletin-bounty-type-group{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-width:0;
}
.bulletin-bounty-type{
  flex:0 0 auto;
  width:max-content;
  max-width:100%;
  padding:2px 6px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  font-size:9px;
  font-weight:900;
  line-height:1.2;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.bulletin-bounty-type.is-buy{
  background:rgba(87,168,255,.16);
  border-color:rgba(87,168,255,.38);
}
.bulletin-bounty-type.is-trade{
  background:rgba(255,159,67,.17);
  border-color:rgba(255,159,67,.48);
}
.bulletin-bounty-issue,
.bulletin-bounty-set,
.bulletin-bounty-subset{
  width:100%;
  min-width:0;
  text-align:center;
}
.bulletin-bounty-issue{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:10px;
  font-weight:850;
  line-height:1.15;
}
.bulletin-bounty-set{
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:normal;
  color:var(--muted);
  font-size:9px;
  font-weight:650;
  line-height:1.12;
}
.bulletin-bounty-owner{
  min-width:0;
  max-width:calc(100% - 54px);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--text);
  font-size:11px;
  font-weight:900;
  line-height:1.1;
  letter-spacing:.01em;
}
.bulletin-bounty-subset{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--muted);
  font-size:9px;
  font-weight:650;
  line-height:1.15;
}
.bulletin-bounty-timestamp{
  position:absolute;
  right:11px;
  bottom:7px;
  z-index:2;
  max-width:calc(100% - 118px);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--muted);
  opacity:.58;
  font-size:8px;
  font-weight:650;
  line-height:1;
  letter-spacing:.01em;
  pointer-events:none;
}
.bulletin-bounty-delete{
  position:absolute;
  top:5px;
  right:5px;
  z-index:2;
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,90,90,.45);
  border-radius:50%;
  background:rgba(27,15,20,.88);
  color:#ffd6d6;
  cursor:pointer;
}
.bulletin-bounty-delete .material-symbols-outlined{font-size:16px;}
.bulletin-bounty-delete:hover,
.bulletin-bounty-delete:focus-visible{
  border-color:rgba(255,90,90,.8);
  background:rgba(255,90,90,.20);
  outline:none;
}
.bulletin-empty{
  padding:14px;
  border:1px solid var(--border);
  border-radius:12px;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
  text-align:center;
}
.bulletin-trade-groups{
  width:100%;
  max-width:100%;
  min-width:0;
}

/* Bounty creation flag-up reuses the Purchase This Card sheet architecture. */
.bulletin-bounty-flyup{
  display:grid;
  gap:12px;
}
.bulletin-bounty-flyup .bulletin-bounty-form{
  display:grid;
  gap:10px;
}
.bulletin-bounty-field{
  display:grid;
  gap:5px;
}
.bulletin-bounty-field > label,
.bulletin-bounty-type-label{
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.bulletin-bounty-select{
  width:100%;
  min-height:44px;
  padding:9px 11px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--panel-2,var(--panel));
  color:var(--text);
  font-size:14px;
  font-weight:700;
  outline:none;
}
.bulletin-bounty-select:disabled{opacity:.55;}
.bulletin-bounty-select:focus-visible{
  border-color:var(--focus);
  box-shadow:0 0 0 3px var(--focus-ring);
}
.bulletin-bounty-type-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.bulletin-bounty-type-btn{
  min-height:42px;
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(255,255,255,.04);
  color:var(--text);
  cursor:pointer;
  font-size:13px;
  font-weight:850;
}
.bulletin-bounty-type-btn[aria-pressed="true"]{
  border-color:rgba(255,255,255,.32);
  background:rgba(255,255,255,.08);
}
.bulletin-bounty-type-btn.is-buy[aria-pressed="true"]{
  border-color:rgba(87,168,255,.50);
  background:rgba(87,168,255,.18);
}
.bulletin-bounty-type-btn.is-trade[aria-pressed="true"]{
  border-color:rgba(255,159,67,.55);
  background:rgba(255,159,67,.19);
}
.bulletin-bounty-preview{
  display:grid;
  grid-template-columns:78px minmax(0,1fr);
  gap:10px;
  align-items:center;
  min-height:92px;
  padding:9px;
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(255,255,255,.025);
}
.bulletin-bounty-preview img,
.bulletin-bounty-preview-ph{
  width:78px;
  height:92px;
  object-fit:contain;
  border-radius:8px;
  background:rgba(0,0,0,.20);
}
.bulletin-bounty-preview-ph{
  display:grid;
  place-items:center;
  color:var(--muted);
}
.bulletin-bounty-preview-copy{
  min-width:0;
  display:grid;
  gap:4px;
}
.bulletin-bounty-preview-copy strong{
  overflow-wrap:anywhere;
  font-size:13px;
}
.bulletin-bounty-preview-copy span{
  color:var(--muted);
  overflow-wrap:anywhere;
  font-size:11px;
}
.bulletin-bounty-contact-note{
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:10px;
  color:var(--muted);
  background:rgba(255,255,255,.025);
  font-size:12px;
  line-height:1.4;
}
.bulletin-bounty-contact-note.is-missing{
  border-color:rgba(255,90,90,.28);
  color:#ffd6d6;
}
.bulletin-bounty-submit{
  width:100%;
  justify-content:center;
}
.bulletin-bounty-form-msg{
  min-height:18px;
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
  text-align:center;
}
.bulletin-bounty-form-msg.ok{color:#9be6b5;}
.bulletin-bounty-form-msg.err{color:#ff9aa2;}

/* Default Contact Info lives at the top of the existing Privacy modal. */
.privacy-contact-setting{
  display:grid;
  gap:8px;
  margin-bottom:14px;
}
.privacy-contact-toggle{
  width:100% !important;
  min-height:44px;
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  text-align:left;
}
.privacy-contact-toggle > span:nth-child(2){font-weight:800;}
.privacy-contact-chevron{justify-self:end;}
.privacy-contact-panel{
  display:grid;
  gap:8px;
  padding:11px;
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(255,255,255,.025);
}
.privacy-contact-panel[hidden]{display:none !important;}
.privacy-contact-label,
.privacy-members-label{
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.privacy-contact-note{margin:0 !important;}
.privacy-contact-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.privacy-contact-actions .auth-btn{justify-content:center;}
.privacy-members-label{
  margin:4px 0 8px;
  padding-bottom:7px;
  border-bottom:1px solid var(--border);
}

@media (max-width:780px){
  .bulletin-board-page{gap:12px;}
  .bulletin-bounty-scroller{
    --bulletin-bounty-card-height:120px;
    --bulletin-bounty-gap:8px;
    --bulletin-bounty-peek:24px;
    max-height:calc((var(--bulletin-bounty-card-height) * 2) + (var(--bulletin-bounty-gap) * 2) + var(--bulletin-bounty-peek));
    padding:4px 3px;
    scrollbar-gutter:auto;
  }
  .bulletin-bounty-grid{
    grid-template-columns:minmax(0,1fr);
    gap:var(--bulletin-bounty-gap);
  }
  .bulletin-bounty-card{
    width:100%;
    max-width:100%;
    min-width:0;
    height:var(--bulletin-bounty-card-height);
  }
  .bulletin-bounty-contact{
    grid-template-columns:84px minmax(0,1fr);
    gap:8px;
    padding:8px;
  }
  .bulletin-bounty-image,
  .bulletin-bounty-image-ph{
    width:84px;
    height:100%;
  }
  .bulletin-bounty-copy{padding:2px 4px;gap:0;}
  .bulletin-bounty-heading-row{gap:5px;margin-bottom:7px;}
  .bulletin-bounty-details{gap:3px;}
  .bulletin-bounty-issue{font-size:10px;}
  .bulletin-bounty-set{font-size:9px;}
  .bulletin-bounty-owner{font-size:10.5px;}
  .bulletin-bounty-subset{font-size:8.75px;}
  .bulletin-bounty-timestamp{
    right:10px;
    bottom:6px;
    max-width:calc(100% - 110px);
    font-size:7.75px;
  }
  .bulletin-bounty-field .uniform-dd-trigger{
    min-height:44px;
    border-color:var(--border);
    background:var(--panel-2,var(--panel));
    font-size:14px;
    font-weight:700;
  }
  .bulletin-bounty-field .uniform-dd-trigger:disabled{
    opacity:.55;
    cursor:default;
  }
  .bulletin-bounty-flyup{
    max-height:100%;
    overflow:auto;
    overscroll-behavior:contain;
  }
  .privacy-contact-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .privacy-contact-actions .auth-btn{width:100%;}
}

/* === SOURCE: 225-price-guide-focused-direct-open.css === */
/* Focused Price Guide opened from More Info > Open in Comic Cut Tools Price Guide.
   The edit control intentionally reuses the Bulletin Board Bounty button sizing/style. */
.price-guide-focused-edit-action-wrap{
  margin:12px 0 14px;
  padding:0 8px;
  box-sizing:border-box;
}
.price-guide-focused-edit-action{
  gap:8px;
}
.price-guide-focused-edit-action .material-symbols-outlined{
  font-size:18px;
  line-height:1;
}
@media (max-width:560px){
  .price-guide-focused-edit-action-wrap{
    margin:10px 0 12px;
    padding:0;
  }
}

/* === SOURCE: 226-price-guide-owner-collection-overview.css === */
/* Owner Collection Overview dashboard: dark Design 3 card tiles + rounded price rows. */
.price-guide-focused-edit-action-wrap{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  justify-content:stretch;
  max-width:920px;
  margin-left:auto;
  margin-right:auto;
}
.price-guide-focused-edit-action-wrap > .bulletin-bounty-action{
  width:100% !important;
  max-width:none !important;
}
.price-guide-focused-view-all-action{
  gap:8px;
}
.price-guide-focused-view-all-action .material-symbols-outlined{
  font-size:18px;
  line-height:1;
}

.price-guide-owner-overview{
  width:100%;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:
    radial-gradient(circle at 12% 0%, rgba(154,139,255,.12), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.022));
  box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.035);
  padding:18px;
  display:grid;
  gap:16px;
  box-sizing:border-box;
  overflow:hidden;
}
.price-guide-owner-overview-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-width:0;
}
.price-guide-owner-overview-heading > div:first-child{
  display:grid;
  gap:4px;
  min-width:0;
}
.price-guide-owner-overview-heading strong{
  color:var(--text);
  font-size:18px;
  font-weight:900;
  line-height:1.1;
  overflow-wrap:anywhere;
}
.price-guide-owner-overview-kicker{
  color:var(--muted);
  font-size:11px;
  font-weight:750;
  letter-spacing:.01em;
  text-transform:none;
}
.price-guide-owner-overview-awards{
  flex:0 0 auto;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
/* Award icons come from the same 1CC Members component; only remove the
   left divider that belongs to the Comic Cuts pill context. */
.price-guide-owner-overview-awards .mc-cuts-award-icons{
  margin-left:0 !important;
  padding-left:0 !important;
  border-left:0 !important;
  max-width:none !important;
  overflow:visible !important;
}
.price-guide-owner-overview-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.price-guide-owner-overview-metric{
  --overview-accent:154,139,255;
  position:relative;
  min-width:0;
  min-height:116px;
  padding:14px 13px 13px;
  border:1px solid rgba(var(--overview-accent),.22);
  border-radius:14px;
  background:
    linear-gradient(180deg, rgba(var(--overview-accent),.10), rgba(var(--overview-accent),.035) 58%, rgba(255,255,255,.018));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  gap:4px;
  overflow:hidden;
}
.price-guide-owner-overview-metric.is-blue{ --overview-accent:0,183,255; }
.price-guide-owner-overview-metric.is-pink{ --overview-accent:255,107,214; }
.price-guide-owner-overview-metric.is-teal{ --overview-accent:0,230,190; }
.price-guide-owner-overview-metric.is-gold{ --overview-accent:239,190,84; }
.price-guide-owner-overview-metric.is-orange{ --overview-accent:214,111,58; }
.price-guide-owner-overview-metric.is-violet{ --overview-accent:154,139,255; }
.price-guide-owner-overview-metric.is-green{ --overview-accent:78,205,116; }
.price-guide-owner-overview-metric-main{
  position:relative;
  z-index:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
}
.price-guide-owner-overview-metric-icon{
  width:32px;
  height:32px;
  flex:0 0 auto;
  border:1px solid rgba(var(--overview-accent),.30);
  border-radius:10px;
  background:rgba(var(--overview-accent),.10);
  color:rgb(var(--overview-accent));
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:19px !important;
  line-height:1 !important;
  margin-bottom:4px;
}
.price-guide-owner-overview-metric-main > strong{
  position:relative;
  z-index:1;
  color:var(--text);
  font-size:21px;
  font-weight:900;
  line-height:1.05;
  overflow-wrap:anywhere;
}
.price-guide-owner-overview-metric-label{
  position:relative;
  z-index:1;
  color:rgba(255,255,255,.82);
  font-size:10px;
  font-weight:900;
  letter-spacing:.045em;
  text-transform:uppercase;
  line-height:1.25;
}
.price-guide-owner-overview-metric > small{
  position:relative;
  z-index:1;
  color:var(--muted);
  font-size:10px;
  font-weight:650;
  line-height:1.3;
}
.price-guide-owner-overview-mini-meter{
  position:relative;
  z-index:1;
  width:100%;
  height:6px;
  margin-top:auto;
  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;
  background:rgba(255,255,255,.04);
  overflow:hidden;
}
.price-guide-owner-overview-mini-meter > span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:rgb(var(--overview-accent));
  opacity:.82;
}
.price-guide-owner-overview-note{
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:rgba(255,255,255,.018);
  color:var(--muted);
  font-size:10px;
  font-weight:650;
  line-height:1.45;
}

/* Desktop overview: a 2 x 2 collection block on the left and the two money
   tiles stacked in the right column. */
@media (min-width:781px){
  .price-guide-owner-overview-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    grid-template-rows:repeat(2,minmax(0,1fr));
    align-items:stretch;
  }
  .price-guide-owner-overview-metric:nth-child(1){ grid-column:1; grid-row:1; }
  .price-guide-owner-overview-metric:nth-child(2){ grid-column:2; grid-row:1; }
  .price-guide-owner-overview-metric:nth-child(3){ grid-column:1; grid-row:2; }
  .price-guide-owner-overview-metric:nth-child(4){ grid-column:2; grid-row:2; }
  .price-guide-owner-overview-metric:nth-child(5){ grid-column:3; grid-row:1; }
  .price-guide-owner-overview-metric:nth-child(6){ grid-column:3; grid-row:2; }
  .price-guide-owner-overview-metric{
    min-height:104px;
  }
  /* Count tiles: icon + number + label share one row. */
  .price-guide-owner-overview-metric.is-count .price-guide-owner-overview-metric-main{
    width:100%;
    flex-direction:row;
    align-items:center;
    gap:8px;
    flex-wrap:nowrap;
  }
  .price-guide-owner-overview-metric.is-count .price-guide-owner-overview-metric-icon{
    margin-bottom:0;
  }
  .price-guide-owner-overview-metric.is-count .price-guide-owner-overview-metric-label{
    min-width:0;
    overflow-wrap:anywhere;
  }
  /* Money tiles: icon + amount share the first row; label stays beneath it. */
  .price-guide-owner-overview-metric.is-money .price-guide-owner-overview-metric-main{
    width:100%;
    flex-direction:row;
    align-items:center;
    gap:9px;
  }
  .price-guide-owner-overview-metric.is-money .price-guide-owner-overview-metric-icon{
    margin-bottom:0;
  }
}

/* Dashboard price rows are individual rounded information/value cards. */
.mc-price-guide.is-owner-view-all .mc-price-row{
  border-radius:14px !important;
  overflow:hidden;
}
.mc-price-guide.is-owner-view-all .mc-price-img{
  border-radius:9px;
  overflow:hidden;
}
.mc-price-guide.is-owner-view-all .mc-price-edit-input{
  border-radius:9px !important;
}

@media (max-width:780px){
  .price-guide-owner-overview{
    padding:13px;
    gap:13px;
    border-radius:16px;
  }
  .price-guide-owner-overview-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  .price-guide-owner-overview-metric{
    min-height:112px;
    padding:12px 11px;
    border-radius:12px;
  }
  .price-guide-owner-overview-heading{
    align-items:flex-start;
  }
  .price-guide-owner-overview-heading strong{
    font-size:16px;
  }
  .price-guide-owner-overview-metric-main > strong{
    font-size:19px;
  }
  .mc-price-guide.is-owner-view-all .mc-price-row{
    border-radius:12px !important;
  }
}

@media (max-width:780px){
  .price-guide-focused-edit-action-wrap{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .price-guide-focused-edit-action-wrap > .price-guide-focused-edit-action{
    grid-column:1 / -1;
  }
}

@media (max-width:430px){
  .price-guide-focused-edit-action-wrap{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  .price-guide-focused-edit-action-wrap > .price-guide-focused-edit-action{
    grid-column:1 / -1;
  }
  .price-guide-focused-edit-action-wrap .bulletin-bounty-action{
    min-height:48px;
    padding-left:8px;
    padding-right:8px;
    font-size:12px;
  }
  .price-guide-owner-overview-metric-main > strong{
    font-size:18px;
  }
  .price-guide-owner-overview-metric-label{
    font-size:9px;
  }
}


/* Dashboard owned-card anatomy:
   - Favorite heart + count sits in the Comic Book Issue row on both mobile and desktop.
   - Mobile shows true Serial Number directly below the Front/Back images.
   - Desktop shows true Serial Number in the former Favs value-grid slot.
   SN on Card is intentionally not used for either Dashboard SN display. */
.mc-price-dashboard-mobile-sn,
.mc-price-dashboard-desktop-sn,
.mc-price-dashboard-issue-fav{
  display:none;
}
@media (max-width:780px){
  .mc-price-guide.is-owner-view-all .mc-price-row{
    position:relative !important;
    grid-template-columns:48px 48px minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    align-items:start !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-row > .mc-price-img:nth-child(1){
    grid-column:1 !important;
    grid-row:1 !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-row > .mc-price-img:nth-child(2){
    grid-column:2 !important;
    grid-row:1 !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-dashboard-mobile-sn{
    display:flex !important;
    grid-column:1 / 3 !important;
    grid-row:2 !important;
    min-width:0;
    align-items:baseline;
    justify-content:center;
    gap:3px;
    padding-top:2px;
    color:var(--text);
    font-size:10px;
    font-weight:800;
    line-height:1.2;
    overflow-wrap:anywhere;
    text-align:center;
  }
  .mc-price-guide.is-owner-view-all .mc-price-dashboard-mobile-sn > span{
    color:var(--muted);
    font-weight:900;
  }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-details{
    grid-column:3 !important;
    grid-row:1 / span 2 !important;
    padding-right:0;
    box-sizing:border-box;
  }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-issue{
    width:100%;
    flex-wrap:nowrap !important;
    align-items:flex-start !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-issue > span:first-child{
    flex:1 1 auto;
    min-width:0;
  }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-sn,
  .mc-price-guide.is-owner-view-all .mc-price-dashboard-desktop-sn{
    display:none !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-dashboard-issue-fav{
    flex:0 0 auto;
    margin-left:auto;
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    gap:3px;
    min-width:28px;
    min-height:20px;
    color:var(--text);
    font-size:10px;
    font-weight:900;
    line-height:1;
    white-space:nowrap;
    pointer-events:none;
  }
  .mc-price-guide.is-owner-view-all .mc-price-dashboard-issue-fav .material-symbols-outlined{
    color:#ff7898;
    font-size:15px !important;
    line-height:1 !important;
    font-variation-settings:'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 20;
  }
}

/* === SOURCE: 227-price-guide-main-view-all.css === */
/* Main Price Guide owner View All shortcut + source-aware owner overview return button. */
.price-guide-main-view-all-action{
  min-height:44px !important;
  height:44px !important;
  padding:0 14px !important;
  gap:7px;
  white-space:nowrap;
}
.price-guide-main-view-all-action .material-symbols-outlined{
  font-size:18px;
  line-height:1;
}
.price-guide-main-view-all-desktop{
  flex:0 0 auto;
  width:auto !important;
  min-width:118px !important;
  max-width:none !important;
  margin:0 !important;
}
.price-guide-main-view-all-mobile{
  display:none !important;
}

@media (min-width:781px){
  /* Guest Price Guide has only Issue + Hide Covers. The previous View All patch
     forced a three-column grid for guests too, placing Issue in an `auto` column
     and collapsing its trigger to the width of "All". */
  body.global-price-guide-active .price-guide-filterbar > .price-guide-filter-desktop{
    width:min(930px, 100%) !important;
    grid-template-columns:minmax(0,1fr) auto !important;
  }
  /* Logged-in Price Guide really does have three controls. */
  body.global-price-guide-active .price-guide-filterbar > .price-guide-filter-desktop.has-main-view-all{
    grid-template-columns:auto minmax(0,1fr) auto !important;
  }
}
@media (max-width:780px), (hover:none) and (pointer:coarse){
  .price-guide-main-view-all-desktop{
    display:none !important;
  }
  .price-guide-filterbar > .price-guide-main-view-all-mobile{
    display:flex !important;
    grid-column:1 / -1 !important;
    grid-row:2 !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
    justify-content:center !important;
  }
}

/* === SOURCE: 228-price-guide-value-signal-collapse.css === */
/* Value Signal is collapsed to its primary box by default. Clicking the main box reveals the three supporting metrics. */
.mc-value-signal-hero{
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.mc-value-signal-hero:hover{
  transform:translateY(-1px);
}
.mc-value-signal-hero:focus-visible{
  outline:2px solid rgba(255,255,255,.72);
  outline-offset:3px;
}
.mc-value-signal-hero[aria-expanded="true"]{
  transform:none;
}
.mc-value-signal-segment{
  cursor:inherit !important;
}
.mc-value-signal-stats[hidden]{
  display:none !important;
}
.mc-value-signal-wrap.is-expanded .mc-value-signal-stats{
  display:grid;
}

/* === SOURCE: 229-tracker-archive-submit.css === */
.ccc-tracker-page-loading{
  width:100%;
  min-height:220px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:var(--muted);
  font-size:13px;
  text-align:center;
}
.ccc-tracker-page-loading-icon{
  color:var(--text);
  font-size:30px;
  line-height:1;
  animation:ccc-tracker-page-loading-spin .85s linear infinite;
}
@keyframes ccc-tracker-page-loading-spin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){
  .ccc-tracker-page-loading-icon{ animation:none; }
}

/* Comic Cut Tracker -> Submit to Comic Cut Archive.
   Mobile intentionally reuses the proven Bounty/Purchase flag-up shell. */
.ccc-tracker-archive-submit-action-wrap{
  margin:10px auto 12px;
}
.archive-map-summary-card:has(+ .ccc-tracker-archive-submit-action-wrap){
  margin-bottom:4px;
}
.archive-map-summary-card + .ccc-tracker-archive-submit-action-wrap{
  margin-top:0;
}
.ccc-tracker-archive-submit-action{
  gap:8px;
}
.ccc-tracker-archive-submit-action .material-symbols-outlined{
  font-size:18px;
  line-height:1;
}
.ccc-tracker-archive-submit-modal{
  width:min(640px,100%);
}
.ccc-tracker-archive-submit-modal .ccc-tracker-archive-submit-uploader{
  grid-template-columns:minmax(0,1fr);
  gap:10px;
  margin:0;
  padding:12px;
  box-shadow:none;
}
.found-cuts-owner-choice{
  display:grid;
  gap:6px;
  min-width:0;
}
.found-cuts-owner-choice-row{
  min-width:0;
}
.found-cuts-owner-choice-btn{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
@media (max-width:820px), (hover:none) and (pointer:coarse){
  .ccc-tracker-archive-submit-modal{
    width:100%;
  }
  .ccc-tracker-archive-submit-modal .ccc-tracker-archive-submit-uploader{
    padding:10px;
  }
  .ccc-tracker-archive-submit-action-wrap{
    width:100%;
    margin:2px 0 11px;
  }
  .archive-map-summary-card + .ccc-tracker-archive-submit-action-wrap{
    margin-top:0;
  }
  .ccc-tracker-archive-submit-action{
    width:100% !important;
    max-width:none !important;
  }
}

/* === SOURCE: 231-mobile-value-highlight-notes-status-layout.css === */
/* Value Highlights: mobile explanatory-note cleanup. */

@media (max-width:780px){
  /* Mobile Value Highlights should be concise: hide every explanatory sentence. */
  .ccc-public-highlight-slider--mobile .cc-highlight-note,
  #result .card .ccc-public-highlight-slider--mobile .cc-highlight-note{
    display:none !important;
  }
}


/* === SOURCE: 232-collector-status-burnt-orange-accent.css === */
/* Collector Status Value Highlight: unique burnt orange accent. */
.card .cc-highlight-row.cc-highlight-collector-status{
  --cc-highlight-accent:#E8794F !important;
  --ccg-accent:#E8794F !important;
  --ccc-card-accent:#E8794F !important;
  --ccg-soft:rgba(232,121,79,.10) !important;
}

.card .cc-highlight-row.cc-highlight-collector-status > .cc-highlight-icon,
.card .cc-highlight-row.cc-highlight-collector-status > .cc-highlight-icon .material-symbols-outlined,
.card .cc-highlight-row.cc-highlight-collector-status .cc-highlight-label,
.card .cc-highlight-row.cc-highlight-collector-status .cc-status-inline-separator{
  color:#E8794F !important;
}

/* Counts and status names use the same bright number/unit treatment as the
   other numeric Value Highlights; the card accent and separator remain orange. */
.card .cc-highlight-row.cc-highlight-collector-status .ccc-highlight-number,
.card .cc-highlight-row.cc-highlight-collector-status .ccc-highlight-unit{
  color:rgba(242,243,255,.98) !important;
}

/* Price Guide save/loading feedback: shown while saved values and averages refresh. */
.price-guide-save-loading{
  position:fixed;
  inset:0;
  z-index:2147482500;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  box-sizing:border-box;
  background:rgba(2,2,7,.48);
  -webkit-backdrop-filter:blur(2px);
  backdrop-filter:blur(2px);
  opacity:0;
  transition:opacity .12s ease;
  pointer-events:auto;
}
.price-guide-save-loading.is-visible{ opacity:1; }
.price-guide-save-loading-card{
  width:min(360px,calc(100vw - 40px));
  min-height:150px;
  padding:24px 22px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  background:
    radial-gradient(circle at 50% 0%,rgba(154,139,255,.15),transparent 58%),
    linear-gradient(180deg,rgba(20,20,30,.98),rgba(8,8,13,.98));
  box-shadow:0 18px 50px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.035);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:var(--muted);
  text-align:center;
  box-sizing:border-box;
}
.price-guide-save-loading-card strong{
  color:var(--text);
  font-size:15px;
  font-weight:900;
}
.price-guide-save-loading-card > span:last-child{
  max-width:290px;
  font-size:11px;
  line-height:1.4;
}
.price-guide-save-loading-icon{
  color:rgb(154,139,255);
  font-size:32px !important;
  line-height:1 !important;
  animation:ccc-price-guide-save-spin .9s linear infinite;
}
@keyframes ccc-price-guide-save-spin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){
  .price-guide-save-loading{ transition:none; }
  .price-guide-save-loading-icon{ animation:none; }
}



/* === SOURCE: 226-price-guide-owner-collection-overview.css v15 additions === */


/* Desktop Dashboard: owned Comic Cuts display as three rounded cards per row.
   Reuse the compact detail markup already used on mobile so every price/value
   remains visible without squeezing the old eight-column table into each card. */
@media (min-width:901px){
  .mc-price-guide.is-owner-view-all .mc-price-list{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:12px !important;
    align-items:start;
  }
  .mc-price-guide.is-owner-view-all .mc-price-head{
    display:none !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-row{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    grid-template-rows:auto auto !important;
    gap:10px !important;
    align-items:start !important;
    padding:12px !important;
    padding-bottom:12px !important;
    min-width:0;
  }
  .mc-price-guide.is-owner-view-all .mc-price-row > .mc-price-img{
    width:100% !important;
    max-width:none !important;
    aspect-ratio:3/4 !important;
    grid-row:1 !important;
    margin:0 !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-row > .mc-price-img:nth-child(1){ grid-column:1 !important; }
  .mc-price-guide.is-owner-view-all .mc-price-row > .mc-price-img:nth-child(2){ grid-column:2 !important; }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-details{
    display:block !important;
    grid-column:1 / -1 !important;
    grid-row:2 !important;
    min-width:0 !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-issue{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:flex-start !important;
    column-gap:8px;
    row-gap:3px;
    font-size:12px !important;
    font-weight:850 !important;
    line-height:1.3 !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-issue > span:first-child{
    flex:1 1 auto;
    min-width:0;
    overflow-wrap:anywhere;
  }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-sn{
    display:none !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-dashboard-issue-fav{
    flex:0 0 auto;
    margin-left:auto;
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    gap:3px;
    min-width:28px;
    min-height:20px;
    color:var(--text);
    font-size:10px;
    font-weight:900;
    line-height:1;
    white-space:nowrap;
    pointer-events:none;
  }
  .mc-price-guide.is-owner-view-all .mc-price-dashboard-issue-fav .material-symbols-outlined{
    color:#ff7898;
    font-size:15px !important;
    line-height:1 !important;
    font-variation-settings:'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 20;
  }
  .mc-price-guide.is-owner-view-all .mc-price-dashboard-desktop-sn{
    display:block !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-values{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:5px 10px !important;
    margin-top:5px;
  }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-values > div{
    display:block !important;
    min-width:0;
    font-size:11px !important;
    line-height:1.3 !important;
    color:var(--text);
    font-weight:700;
    overflow-wrap:anywhere;
  }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-favs{
    display:none !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-mobile-values span{
    color:var(--muted);
    font-weight:800;
  }
  .mc-price-guide.is-owner-view-all .mc-price-row > .mc-price-issue,
  .mc-price-guide.is-owner-view-all .mc-price-row > .mc-price-sn,
  .mc-price-guide.is-owner-view-all .mc-price-row > .mc-price-money,
  .mc-price-guide.is-owner-view-all .mc-price-row > .mc-price-social{
    display:none !important;
  }
  .mc-price-guide.is-owner-view-all .mc-price-edit-input{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box;
  }
}


/* === 2026-09-06 v20: Comic Cut Tools Price Guide nav + rounding === */
.price-guide-focused-edit-action-wrap{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  max-width:920px !important;
}
.price-guide-focused-edit-action-wrap > .bulletin-bounty-action{
  width:100% !important;
  max-width:none !important;
}
.price-guide-focused-price-guide-action,
.price-guide-focused-view-all-action,
.price-guide-focused-edit-action{
  gap:8px;
}
.price-guide-focused-price-guide-action .material-symbols-outlined,
.price-guide-focused-view-all-action .material-symbols-outlined,
.price-guide-focused-edit-action .material-symbols-outlined{
  font-size:18px;
  line-height:1;
}
body.price-guide-active .mc-price-chart-card{
  border-radius:16px;
  overflow:hidden;
}
body.price-guide-active .mc-value-signal-hero{
  border-radius:16px;
  overflow:hidden;
}
body.price-guide-active .mc-value-signal-stat{
  border-radius:12px;
  overflow:hidden;
}
body.price-guide-active .mc-price-row{
  border-radius:14px;
  overflow:hidden;
}
@media (max-width:780px){
  .price-guide-focused-edit-action-wrap{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .price-guide-focused-edit-action-wrap > .price-guide-focused-edit-action{
    grid-column:1 / -1 !important;
  }
  body.price-guide-active .mc-price-chart-card,
  body.price-guide-active .mc-value-signal-hero{
    border-radius:14px;
  }
  body.price-guide-active .mc-price-row{
    border-radius:12px;
  }
}

/* === 2026-09-07 Additional Information Status burnt-orange sync === */

/* Status is the one Comic Cut Info field that follows the Collector Status burnt-orange accent. */
.card .more .kv.ccc-additional-info-status{
  --ccg-accent:#E8794F !important;
  --ccg-soft:rgba(232,121,79,.10) !important;
}
.card .more .kv.ccc-additional-info-status .k{
  color:#E8794F !important;
}

/* Error in Additional Information uses the same coral as Error Comic Cut. */
.card .more .kv.ccc-additional-info-error{
  --ccg-accent:#FF5C6C !important;
  --ccg-soft:rgba(255,92,108,.10) !important;
}
.card .more .kv.ccc-additional-info-error .k{
  color:#FF5C6C !important;
}


/* Global Comic Cut Tracker privacy control. */
.privacy-tracker-setting{
  display:grid;
  gap:7px;
  margin:0 0 14px;
}
.privacy-tracker-toggle{
  width:100% !important;
  min-height:44px;
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  text-align:left;
}
.privacy-tracker-toggle > span:nth-child(2){
  min-width:0;
  font-weight:800;
}
.privacy-tracker-state{
  min-width:42px;
  padding:4px 8px;
  border:1px solid var(--border);
  border-radius:999px;
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  text-align:center;
  text-transform:uppercase;
}
.privacy-tracker-toggle[aria-pressed="true"] .privacy-tracker-state{
  color:#fff;
  border-color:rgba(154,139,255,.65);
  background:rgba(154,139,255,.28);
}
.privacy-tracker-note{
  margin:0 !important;
}
.privacy-tracker-msg{
  min-height:16px;
}
@media (max-width:780px){
  .privacy-tracker-toggle{
    grid-template-columns:auto minmax(0,1fr) auto;
  }
}

/* === SOURCE: 233-full-details-mobile-pill-icons-checklist-bookmark.css === */
/* 2026-09-11: Full Details mobile pill icons + Checklist bookmark in-place action. */
.card .pillgrid .pill .ccc-summary-pill-icon{
  display:none;
  pointer-events:none;
}

@media (max-width:780px), (hover:none) and (pointer:coarse){
  .card .pillgrid .pill.ccc-summary-pill-with-icon{
    position:relative !important;
    padding-right:38px !important;
  }
  .card .pillgrid .pill.ccc-summary-pill-with-icon > .ccc-summary-pill-icon{
    display:block;
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    font-size:20px;
    line-height:1;
    color:rgba(242,243,255,.92);
    opacity:.92;
  }
}

.set-checklist-list--logged-in .comic-cuts-bookmark-toggle{
  cursor:pointer;
  border-radius:8px;
}
@media (hover: hover) and (pointer: fine){
.set-checklist-list--logged-in .comic-cuts-bookmark-toggle:hover{
  background:rgba(255,255,255,.08);
  outline:none;
}
}
.set-checklist-list--logged-in .comic-cuts-bookmark-toggle:focus-visible{
  background:rgba(255,255,255,.08);
  outline:none;
}
.set-checklist-list--logged-in .comic-cuts-bookmark-toggle[aria-busy="true"]{
  opacity:.55;
  pointer-events:none;
}

/* === SOURCE: 234-shared-page-loading.css === */
/* Shared page-level loading state.
   Browse Sets, Comic Books, Price Guide, Comic Cut Tracker, and Bulletin Board
   use the same loader component so page navigation has one lifecycle and visual language. */
.ccc-page-loading{
  width:100%;
  min-height:clamp(260px, 46vh, 520px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:28px 16px;
  box-sizing:border-box;
  color:var(--muted);
  text-align:center;
}
.ccc-page-loading strong{
  color:var(--text);
  font-size:15px;
  font-weight:900;
}
.ccc-page-loading-detail{
  font-size:12px;
  line-height:1.35;
}
.ccc-page-loading-icon{
  color:var(--text);
  font-size:30px;
  line-height:1;
  animation:ccc-page-loading-spin .9s linear infinite;
}
@keyframes ccc-page-loading-spin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){
  .ccc-page-loading-icon{ animation:none; }
}

/* === SOURCE: 235-mobile-header-home-search-flyout.css === */
/* Mobile-only navigation restructure. Desktop keeps the existing search row and left flyout. */
.ccc-mobile-right-flyout-only,
.ccc-mobile-home-search-action,
.ccc-mobile-search-screen{display:none !important;}

@media (max-width:780px){
  body > .container > .searchwrap{display:none !important;}
  #leftFlyout.flyout.left{display:none !important;}

  #rightFlyout .ccc-mobile-right-flyout-only[data-mobile-visible="true"]{
    display:flex !important;
    width:100% !important;
    align-items:center !important;
    box-sizing:border-box !important;
  }
  #rightFlyout .ccc-mobile-right-flyout-only[data-mobile-visible="false"]{display:none !important;}
  #rightFlyout a.ccc-mobile-right-flyout-only{text-decoration:none !important;}

  html body #homeBrowseActions{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    column-gap:4px !important;
    padding-left:2px !important;
    padding-right:2px !important;
  }
  html body #homeBrowseActions > #homeSearchComicCutsBtn{display:flex !important;}
  html body #homeBrowseActions > #homeBrowseByComicBookBtn{display:none !important;}

  .ccc-mobile-search-screen{
    --ccc-mobile-search-top:0px;
    --ccc-mobile-search-height:100dvh;
    position:fixed;
    left:0; right:0; top:var(--ccc-mobile-search-top);
    height:var(--ccc-mobile-search-height);
    z-index:40000;
    box-sizing:border-box;
    background:#101114;
    color:var(--text,#fff);
    flex-direction:column;
    overflow:hidden;
    overscroll-behavior:none;
  }
  .ccc-mobile-search-screen.open{display:flex !important;}
  .ccc-mobile-search-toprow{
    flex:0 0 auto;
    min-height:86px;
    padding:calc(11px + env(safe-area-inset-top,0px)) 18px 10px;
    box-sizing:border-box;
    display:grid;
    grid-template-columns:48px minmax(0,1fr) 48px;
    align-items:end;
    gap:10px;
    background:#101114;
  }
  .ccc-mobile-search-round-btn{
    width:48px; height:48px; margin:0; padding:0; border:0; border-radius:999px;
    background:#202124; color:rgba(255,255,255,.72);
    display:inline-flex; align-items:center; justify-content:center;
    touch-action:manipulation; -webkit-tap-highlight-color:transparent;
  }
  .ccc-mobile-search-round-btn .material-symbols-outlined{font-size:28px;line-height:1;}
  .ccc-mobile-search-round-btn:active{color:#fff;background:#2b2d31;transform:scale(.96);}
  .ccc-mobile-search-title{
    align-self:center; padding-bottom:10px; text-align:center;
    font-size:20px; line-height:1.2; font-weight:750; letter-spacing:.01em;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  }
  .ccc-mobile-search-results{
    flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden;
    -webkit-overflow-scrolling:touch; overscroll-behavior:contain;
    padding:12px 18px 22px; box-sizing:border-box; scrollbar-width:none;
  }
  .ccc-mobile-search-results::-webkit-scrollbar{display:none;}
  .ccc-mobile-search-start,.ccc-mobile-search-no-results,.ccc-mobile-search-loading{
    min-height:42vh; padding:20px; box-sizing:border-box;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:8px; text-align:center; color:var(--muted,#a8a9ad);
  }
  .ccc-mobile-search-start .material-symbols-outlined,.ccc-mobile-search-no-results .material-symbols-outlined{font-size:38px;opacity:.62;}
  .ccc-mobile-search-start strong,.ccc-mobile-search-no-results strong{color:var(--text,#fff);font-size:18px;}
  .ccc-mobile-search-start > span:last-child,.ccc-mobile-search-no-results > span:last-child{max-width:290px;font-size:13px;line-height:1.45;}
  .ccc-mobile-search-section{margin:0 0 18px;padding:0;}
  .ccc-mobile-search-section-heading{
    min-height:30px; padding:0 2px 8px; display:flex; align-items:center; justify-content:space-between;
    gap:12px; color:rgba(255,255,255,.70); font-size:14px; font-weight:750; letter-spacing:.01em;
  }
  .ccc-mobile-search-section-count{color:var(--muted,#a8a9ad);font-size:12px;font-weight:600;}
  .ccc-mobile-search-result-row{
    appearance:none; -webkit-appearance:none; width:100%; min-height:102px; margin:0; padding:9px 0;
    border:0; border-bottom:1px solid rgba(255,255,255,.06); background:transparent; color:inherit;
    display:grid; grid-template-columns:72px minmax(0,1fr) 26px; align-items:center; gap:14px;
    text-align:left; font:inherit; -webkit-tap-highlight-color:transparent; touch-action:manipulation;
  }
  .ccc-mobile-search-result-row:last-child{border-bottom-color:transparent;}
  .ccc-mobile-search-result-row:active{background:rgba(255,255,255,.045);}
  .ccc-mobile-search-media{
    width:72px; height:88px; border-radius:7px; border:1px solid rgba(255,255,255,.16);
    background:#151619; display:flex; align-items:center; justify-content:center; overflow:hidden; box-sizing:border-box;
  }
  .ccc-mobile-search-media img{width:100%;height:100%;object-fit:contain;display:block;}
  .ccc-mobile-search-media.is-empty{color:rgba(255,255,255,.55);}
  .ccc-mobile-search-media.is-empty .material-symbols-outlined{font-size:30px;}
  .ccc-mobile-search-result-copy{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:5px;}
  .ccc-mobile-search-result-title{color:#f1f1f3;font-size:16px;line-height:1.35;font-weight:560;overflow-wrap:anywhere;}
  .ccc-mobile-search-result-meta{color:var(--muted,#a8a9ad);font-size:12px;line-height:1.35;overflow-wrap:anywhere;}
  .ccc-mobile-search-result-chevron{justify-self:end;color:rgba(255,255,255,.45);font-size:24px;}
  .ccc-mobile-search-bottom{
    flex:0 0 auto; padding:10px 18px calc(12px + env(safe-area-inset-bottom,0px));
    background:#101114; box-sizing:border-box;
  }
  .ccc-mobile-search-field{
    width:100%; min-height:58px; padding:0 14px; border:1px solid rgba(255,255,255,.24);
    border-radius:999px; background:#101114; display:grid; grid-template-columns:30px minmax(0,1fr) 32px;
    align-items:center; gap:8px; box-sizing:border-box;
  }
  .ccc-mobile-search-field:focus-within{border-color:rgba(255,255,255,.46);}
  .ccc-mobile-search-field-icon{color:rgba(255,255,255,.52);font-size:28px;}
  .ccc-mobile-search-field input{
    min-width:0; width:100%; height:54px; margin:0; padding:0; border:0; outline:0;
    background:transparent; color:#fff; font:inherit; font-size:18px; line-height:1;
  }
  .ccc-mobile-search-field input::placeholder{color:rgba(255,255,255,.55);opacity:1;}
  .ccc-mobile-search-clear{
    width:32px; height:32px; margin:0; padding:0; border:0; border-radius:999px;
    background:transparent; color:rgba(255,255,255,.72); display:inline-flex; align-items:center; justify-content:center;
  }
  .ccc-mobile-search-clear[hidden]{display:none !important;}
  .ccc-mobile-search-clear .material-symbols-outlined{font-size:25px;}
}
@media (max-width:420px){
  .ccc-mobile-search-results{padding-left:14px;padding-right:14px;}
  .ccc-mobile-search-bottom{padding-left:14px;padding-right:14px;}
  .ccc-mobile-search-result-row{grid-template-columns:64px minmax(0,1fr) 22px;gap:12px;}
  .ccc-mobile-search-media{width:64px;height:82px;}
  .ccc-mobile-search-result-title{font-size:15px;}
}