/* FourColorComic v40.31.106 — refresh-stable dashboard + database autocomplete */

/* The navigation order is CSS-owned so refresh never waits for JavaScript to
   rearrange buttons after the first paint. */
#tabs{display:flex!important}
#tabs [data-tab="dashboard"]{order:10}
#tabs [data-tab="collection"]{order:20}
#tabs [data-tab="import"]{order:30}
#tabs [data-tab="catalog"]{order:40}
#tabs [data-tab="marketplace"]{order:50}
#tabs [data-tab="sold"]{order:60}
#tabs [data-tab="discover"]{order:70}
#tabs [data-tab="forum"]{order:80}
#tabs [data-tab="grading"]{order:90}
#tabs [data-tab="settings"]{order:100}
#tabs [data-tab="pricing"]{order:900}
#tabs [data-tab="membership"]{order:910}

/* Stable first-paint footprint for the Collection XP block.  v43 renders this
   placeholder in the exact slot used by the live tracker, and v403195 swaps
   content without shifting the Dashboard grid. */
#dashboard .fcc106-xp-placeholder{pointer-events:none;opacity:1!important}
#dashboard .fcc106-xp-placeholder .fcc192-xp,
#dashboard .fcc106-xp-placeholder .fcc192-xp-sources{min-height:100%}
.fcc106-skeleton-line,.fcc106-skeleton-track,.fcc106-skeleton-tier-grid span,
.fcc106-source-skeleton i,.fcc106-source-skeleton b,.fcc106-source-skeleton small{
  display:block;border-radius:999px;background:rgba(112,132,168,.13)
}
.fcc106-skeleton-line{height:18px;margin:6px 0 14px}.fcc106-skeleton-line.wide{width:45%}.fcc106-skeleton-line.short{width:26%;height:30px}
.fcc106-skeleton-track{height:9px;margin:18px 0 20px;width:100%}
.fcc106-skeleton-tier-grid{display:grid;gap:10px}.fcc106-skeleton-tier-grid span{height:22px;width:100%}
.fcc106-source-skeleton{display:grid!important;align-content:center;justify-items:start;gap:8px!important}
.fcc106-source-skeleton i{width:38px;height:38px}.fcc106-source-skeleton b{width:55%;height:24px}.fcc106-source-skeleton small{width:72%;height:11px}

/* Database one-box autocomplete */
#catalog .v28-catalog-form{align-items:stretch}
#catalog .fcc106-search-wrap{position:relative;min-width:0;flex:1}
#catalog .fcc106-search-wrap>.input{width:100%;min-height:48px;font-size:15px}
#catalog .fcc106-suggestions{position:absolute;z-index:160;top:calc(100% + 7px);left:0;right:0;max-height:min(520px,62vh);overflow:auto;padding:7px;border:1px solid rgba(91,121,166,.5);border-radius:13px;background:rgba(7,14,26,.99);box-shadow:0 22px 55px rgba(0,0,0,.48);backdrop-filter:blur(12px)}
#catalog .fcc106-suggestions.hidden{display:none}
#catalog .fcc106-suggestion{display:grid;grid-template-columns:28px minmax(0,1fr) auto;grid-template-rows:auto auto;gap:2px 10px;align-items:center;width:100%;padding:10px 11px;border:0;border-bottom:1px solid rgba(80,104,143,.2);background:transparent;color:#eaf1fb;text-align:left;cursor:pointer}
#catalog .fcc106-suggestion:last-child{border-bottom:0}
#catalog .fcc106-suggestion:hover,#catalog .fcc106-suggestion:focus-visible{background:#121f34;outline:none}
#catalog .fcc106-suggestion>span{grid-row:1/3;display:grid;place-items:center;width:28px;height:28px;border:1px solid #304764;border-radius:8px;background:#101b2e;font-size:13px}
#catalog .fcc106-suggestion>b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
#catalog .fcc106-suggestion>small{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#7f91aa;font-size:9px}
#catalog .fcc106-suggestion>em{grid-column:3;grid-row:1/3;padding:4px 7px;border:1px solid #344860;border-radius:999px;color:#8da2bb;font-size:8px;font-style:normal;font-weight:850;letter-spacing:.06em;text-transform:uppercase}
#catalog .fcc106-search-hint{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 0}
#catalog .fcc106-search-hint span{padding:4px 8px;border:1px solid rgba(70,99,139,.32);border-radius:999px;background:rgba(10,21,37,.72);color:#8295ae;font-size:9px;font-weight:760}
#catalog .fcc106-commons-creator{text-decoration:none}
#catalog .v4015-catalog-creator span small{display:block;margin-top:1px;color:#7d91a8;font-size:7px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}

@media(max-width:760px){
  #catalog .v28-catalog-form{display:grid;grid-template-columns:1fr}
  #catalog .v28-catalog-form .btn{width:100%;min-height:44px}
  #catalog .fcc106-suggestion{grid-template-columns:26px minmax(0,1fr);padding:10px}
  #catalog .fcc106-suggestion>em{display:none}
}
