/* Four Color Comic v40.29 — visual rebrand only.
   Presentation layer: preserves existing IDs, data attributes, forms, buttons, and application logic. */

:root{
  --fcc-black:#030609;
  --fcc-panel:#071016;
  --fcc-panel-2:#0a1218;
  --fcc-line:#26333c;
  --fcc-line-soft:#18242c;
  --fcc-white:#f4f6f4;
  --fcc-muted:#9aa7ad;
  --fcc-cyan:#13b9eb;
  --fcc-magenta:#e53a82;
  --fcc-yellow:#ffd21c;
  --fcc-green:#71d45b;
  --fcc-red:#ff6262;
  --fcc-accent:var(--fcc-cyan);
  --fcc-accent-2:var(--fcc-magenta);
  --fcc-accent-3:var(--fcc-yellow);
  --bg:var(--fcc-black);
  --panel:var(--fcc-panel);
  --panel-soft:#091117;
  --text:var(--fcc-white);
  --muted:var(--fcc-muted);
  --line:var(--fcc-line);
  --accent:var(--fcc-accent);
  --accent2:var(--fcc-accent);
  --accent-soft:color-mix(in srgb,var(--fcc-accent) 14%,transparent);
  --good:var(--fcc-green);
  --bad:var(--fcc-red);
  --warn:var(--fcc-yellow);
  --chip:#0c1820;
  --shadow:0 14px 36px rgba(0,0,0,.32);
  --shadow-hover:0 20px 48px rgba(0,0,0,.42);
}

html{background:#020507;color-scheme:dark}
body{
  color:var(--fcc-white)!important;
  background:
    radial-gradient(circle at 8% 14%,rgba(19,185,235,.055),transparent 26rem),
    radial-gradient(circle at 91% 74%,rgba(229,58,130,.055),transparent 28rem),
    #030609!important;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.26;
  background-image:
    radial-gradient(circle at 1px 1px,rgba(255,255,255,.14) 1px,transparent 0),
    repeating-linear-gradient(112deg,transparent 0 46px,rgba(255,255,255,.018) 47px 48px,transparent 49px 91px);
  background-size:18px 18px,auto;

}

/* Per-tab color language. */
body[data-fcc-tab="dashboard"]{--fcc-accent:#ffd21c;--fcc-accent-2:#13b9eb;--fcc-accent-3:#e53a82}
body[data-fcc-tab="collection"]{--fcc-accent:#e53a82;--fcc-accent-2:#13b9eb;--fcc-accent-3:#ffd21c}
body[data-fcc-tab="pricing"]{--fcc-accent:#e53a82;--fcc-accent-2:#13b9eb;--fcc-accent-3:#ffd21c}
body[data-fcc-tab="sold"]{--fcc-accent:#e53a82;--fcc-accent-2:#ffd21c;--fcc-accent-3:#13b9eb}
body[data-fcc-tab="grading"]{--fcc-accent:#ffd21c;--fcc-accent-2:#13b9eb;--fcc-accent-3:#e53a82}
body[data-fcc-tab="catalog"]{--fcc-accent:#13b9eb;--fcc-accent-2:#ffd21c;--fcc-accent-3:#e53a82}
body[data-fcc-tab="import"]{--fcc-accent:#13b9eb;--fcc-accent-2:#e53a82;--fcc-accent-3:#ffd21c}
body[data-fcc-tab="marketplace"]{--fcc-accent:#e53a82;--fcc-accent-2:#ffd21c;--fcc-accent-3:#13b9eb}
body[data-fcc-tab="membership"]{--fcc-accent:#ffd21c;--fcc-accent-2:#e53a82;--fcc-accent-3:#13b9eb}
body[data-fcc-tab="settings"],body[data-fcc-tab="admin"]{--fcc-accent:#f4f6f4;--fcc-accent-2:#13b9eb;--fcc-accent-3:#ffd21c}

/* ===== LOGIN: closely follows the supplied Four Color reference while keeping live auth controls ===== */
.auth-gate{
  min-height:max(100vh,900px)!important;
  height:auto!important;
  padding:0!important;
  display:block!important;
  overflow:auto!important;
  position:relative!important;
  isolation:isolate;
  background-color:#020507!important;
  background-image:url('/assets/fourcolor/fcc-login-art.webp')!important;
  background-repeat:no-repeat!important;
  background-position:center top!important;
  background-size:auto max(100vh,900px)!important;
}
.auth-gate::before{
  content:""!important;position:fixed!important;inset:0!important;z-index:-1!important;pointer-events:none!important;
  background:
    linear-gradient(90deg,#020507 0,transparent 16%,transparent 84%,#020507 100%),
    radial-gradient(circle at 50% 58%,transparent 0 23rem,rgba(0,0,0,.10) 38rem,rgba(0,0,0,.34) 60rem)!important;
  opacity:1!important;
}
.auth-gate::after{display:none!important}
.auth-shell,
.auth-shell-v4011{
  position:absolute!important;
  left:50%!important;
  top:59%!important;
  transform:translate(-50%,-50%)!important;
  width:clamp(430px,35vw,565px)!important;
  min-height:0!important;
  display:block!important;
  overflow:visible!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.auth-showcase,.auth-showcase-v4011{display:none!important}
.auth-card,
.auth-card-v4011{
  position:relative!important;
  display:block!important;
  width:100%!important;
  min-height:0!important;
  padding:28px 36px 26px!important;
  border:1px solid transparent!important;
  border-radius:18px!important;
  color:#f7f7f5!important;
  background:
    linear-gradient(#03090d,#03090d) padding-box,
    linear-gradient(115deg,var(--fcc-cyan),rgba(19,185,235,.16) 26%,rgba(229,58,130,.76) 64%,var(--fcc-yellow)) border-box!important;
  box-shadow:0 20px 70px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.auth-card-v4011::before{
  content:""!important;display:block!important;position:absolute!important;inset:5px!important;pointer-events:none!important;border-radius:14px!important;
  border:1px solid rgba(255,255,255,.035)!important;
  background:none!important;
}
.auth-card .auth-mobile-brand,.auth-card-v4011 .auth-mobile-brand{display:none!important}
.auth-card-v4011 .hero-kicker{display:none!important}
.auth-card h1,.auth-card-v4011 h1{
  text-align:center!important;color:#fff!important;font-size:25px!important;line-height:1.12!important;font-weight:760!important;letter-spacing:-.025em!important;margin:0 0 8px!important;text-transform:none!important;font-style:normal!important;
}
.auth-card p,.auth-card-v4011 p{text-align:center!important;color:#b4bdc1!important;font-size:14px!important;margin:0 0 23px!important}
.auth-card .field label,.auth-card-v4011 .field label,.auth-card-v4011 .auth-label-row label{
  color:#f2f4f3!important;font-size:12px!important;letter-spacing:0!important;text-transform:none!important;font-weight:700!important;
}
.auth-card-v4011 .input{
  min-height:44px!important;padding:10px 13px!important;background:#050c10!important;border:1px solid #303c42!important;border-radius:7px!important;color:#f7f7f5!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.018)!important;font-size:14px!important;
}
.auth-card-v4011 .auth-input-wrap .input{padding-right:64px!important}
.auth-card-v4011 .input:focus{border-color:var(--fcc-cyan)!important;box-shadow:0 0 0 3px rgba(19,185,235,.12)!important}
.auth-card-v4011 .input::placeholder{color:#76838a!important}
.auth-text-button,.auth-card-v4011 .auth-text-button{color:var(--fcc-cyan)!important;font-size:12px!important;font-weight:650!important}
.auth-password-toggle{color:#a9b2b7!important;font-size:0!important;width:46px!important}
.auth-password-toggle::after{content:"◉";font-size:15px!important}
.auth-primary-cta,.auth-card-v4011 .btn.primary{
  min-height:44px!important;border:0!important;border-radius:6px!important;color:#080608!important;
  background:linear-gradient(92deg,var(--fcc-cyan) 0%,#40a7d0 22%,var(--fcc-magenta) 52%,#f29927 78%,var(--fcc-yellow) 100%)!important;
  box-shadow:0 8px 26px rgba(0,0,0,.34)!important;font-size:13px!important;font-weight:900!important;letter-spacing:.025em!important;text-transform:uppercase!important;
}
.auth-primary-cta span{display:none!important}
.auth-divider{display:flex!important;align-items:center!important;gap:12px!important;margin:17px 0 12px!important;color:#90999e!important;font-size:11px!important;text-transform:uppercase!important}
.auth-divider::before,.auth-divider::after{content:"";height:1px;background:#263137;flex:1}
.auth-divider span{font-size:0!important}
.auth-divider span::after{content:"OR";font-size:11px!important}
.auth-secondary-cta{
  min-height:44px!important;margin:0!important;padding:10px 13px!important;border:1px solid transparent!important;border-radius:6px!important;color:#f7f7f5!important;text-decoration:none!important;
  background:linear-gradient(#03090d,#03090d) padding-box,linear-gradient(90deg,var(--fcc-cyan),var(--fcc-magenta),var(--fcc-yellow)) border-box!important;font-size:13px!important;font-weight:800!important;text-transform:uppercase!important;
}
.auth-secondary-cta:hover{text-decoration:none!important;background:linear-gradient(#081116,#081116) padding-box,linear-gradient(90deg,var(--fcc-cyan),var(--fcc-magenta),var(--fcc-yellow)) border-box!important}
.auth-price-note{display:flex!important;justify-content:center!important;margin-top:17px!important;color:#849096!important;font-size:10px!important}
.auth-price-note span{background:var(--fcc-yellow)!important;box-shadow:0 0 8px rgba(255,210,28,.46)!important}
.auth-card .status,.auth-card-v4011 .status{background:#081116!important;border-color:#314048!important;border-radius:7px!important;color:#c4ccd0!important;font-size:12px!important}
.auth-card-v4011 .status.ok{border-color:rgba(113,212,91,.45)!important;background:rgba(113,212,91,.07)!important;color:#9de98f!important}
.auth-card-v4011 .status.err{border-color:rgba(255,98,98,.52)!important;background:rgba(255,98,98,.07)!important;color:#ff9b9b!important}
.auth-signup-consent,.auth-verification-steps>div{background:#071015!important;border-color:#2a373d!important}
.auth-verification-steps span{background:var(--fcc-cyan)!important;color:#031018!important}
.auth-field-help,.auth-help,.auth-signup-consent .muted,.auth-signup-consent .v23-check{color:#9aa7ad!important}
.fcc-remember-row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:10px}
.fcc-remember{display:inline-flex;align-items:center;gap:8px;color:#c6cdd0;font-size:11px;cursor:pointer;user-select:none}
.fcc-remember input{accent-color:var(--fcc-cyan);width:14px;height:14px;margin:0}
.fcc-login-mobile-logo{display:none}

/* ===== APP SHELL ===== */
.app{
  position:relative;isolation:isolate;min-height:100vh!important;
  background:
    radial-gradient(circle at 16% 14%,rgba(19,185,235,.045),transparent 25rem),
    radial-gradient(circle at 88% 56%,rgba(229,58,130,.045),transparent 28rem),
    #030609!important;
}
.app::before,.app::after{
  content:"";position:fixed;top:106px;bottom:0;width:max(0px,calc((100vw - 1540px)/2));max-width:190px;z-index:-1;pointer-events:none;opacity:.52;background-repeat:no-repeat;background-size:cover;background-position:center top;
}
.app::before{left:0;background-image:url('/assets/fourcolor/fcc-rail-dashboard.webp')}
.app::after{right:0;background-image:url('/assets/fourcolor/fcc-rail-right.webp');opacity:.32}
body[data-fcc-tab="collection"] .app::before{background-image:url('/assets/fourcolor/fcc-rail-collection.webp')}
body[data-fcc-tab="pricing"] .app::before,
body[data-fcc-tab="catalog"] .app::before,
body[data-fcc-tab="import"] .app::before{background-image:url('/assets/fourcolor/fcc-rail-market.webp')}
body[data-fcc-tab="grading"] .app::before{background-image:url('/assets/fourcolor/fcc-rail-collection.webp')}
body[data-fcc-tab="sold"] .app::before,
body[data-fcc-tab="marketplace"] .app::before{background-image:url('/assets/fourcolor/fcc-rail-dashboard.webp')}

.topbar{
  position:sticky!important;top:0!important;z-index:100!important;
  background:#020508!important;
  border-bottom:1px solid #263239!important;box-shadow:0 10px 32px rgba(0,0,0,.34)!important;
}
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--fcc-cyan),transparent 23%,var(--fcc-magenta) 48%,transparent 72%,var(--fcc-yellow));opacity:.72;pointer-events:none}
.topinner{
  width:min(1540px,100%)!important;margin:auto!important;padding:10px 18px 8px!important;display:grid!important;
  grid-template-columns:minmax(230px,auto) 1fr auto!important;grid-template-rows:auto auto!important;gap:7px 18px!important;align-items:center!important;
}
.topinner>.brand{grid-column:1;grid-row:1/3}
.topinner>.cloud-user{grid-column:3;grid-row:1;align-self:center}
.topinner>.tabs{grid-column:2/4;grid-row:2}
.fcc-brand{display:flex!important;align-items:center!important;gap:12px!important;color:#fff!important;white-space:nowrap!important}
.fcc-brand img{display:block;width:148px;height:auto;object-fit:contain;filter:drop-shadow(0 7px 16px rgba(0,0,0,.38))}
.fcc-brand-copy{display:flex;flex-direction:column;gap:2px}
.fcc-brand-copy strong{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#f3f5f3}
.fcc-brand-copy small{font-size:10px!important;line-height:1.15!important;letter-spacing:.08em!important;text-transform:uppercase;color:#b6c0c4!important}
.fcc-brand-copy em{font-style:normal;color:var(--fcc-cyan)}
.cloud-user{display:flex!important;align-items:center!important;gap:8px!important;color:#dce1e3!important}
.cloud-user-email{max-width:210px!important;overflow:hidden;text-overflow:ellipsis;color:#c6ced1!important;font-size:11px!important}
.membership-top-badge{background:#071820!important;border:1px solid rgba(19,185,235,.28)!important;color:var(--fcc-cyan)!important;text-transform:uppercase!important;letter-spacing:.06em!important}
#signOutBtn{background:#080e12!important;border-color:#2c383e!important;color:#d6dcdf!important}
.tabs{
  display:flex!important;flex-wrap:nowrap!important;justify-content:flex-start!important;gap:1px!important;margin:0!important;padding:0!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none!important;
}
.tabs::-webkit-scrollbar{display:none!important}
.tabbtn{
  position:relative!important;flex:0 0 auto!important;display:inline-flex!important;align-items:center!important;gap:6px!important;
  min-height:34px!important;padding:7px 10px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#c3cbce!important;
  font-size:11px!important;line-height:1!important;font-weight:700!important;letter-spacing:.015em!important;text-transform:uppercase!important;transition:.16s ease!important;
}
.tabbtn::before{display:inline-grid;place-items:center;width:16px;color:#e8ecea;font-size:13px;opacity:.88}
.tabbtn[data-tab="dashboard"]::before{content:"⌂"}.tabbtn[data-tab="collection"]::before{content:"▤"}.tabbtn[data-tab="pricing"]::before{content:"↗"}.tabbtn[data-tab="sold"]::before{content:"▣"}.tabbtn[data-tab="grading"]::before{content:"♢"}.tabbtn[data-tab="catalog"]::before{content:"▥"}.tabbtn[data-tab="import"]::before{content:"⇧"}.tabbtn[data-tab="marketplace"]::before{content:"◫"}.tabbtn[data-tab="settings"]::before{content:"•••";letter-spacing:-2px}.tabbtn[data-tab="admin"]::before{content:"⚙"}
.tabbtn:hover{background:rgba(255,255,255,.035)!important;color:#fff!important}
.tabbtn.active{background:transparent!important;color:#fff!important;font-weight:850!important}
.tabbtn.active::before{color:var(--fcc-accent)!important}
.tabbtn.active::after{content:"";position:absolute;left:8px;right:8px;bottom:0;height:2px;background:var(--fcc-accent);box-shadow:0 0 12px color-mix(in srgb,var(--fcc-accent) 65%,transparent)}

.content{width:min(1540px,100%)!important;margin:auto!important;padding:18px 18px 46px!important;position:relative;z-index:2}
.tab{position:relative}
.tab.active{animation:none}
@keyframes fccTabIn{from{opacity:.45;transform:translateY(3px)}to{opacity:1;transform:none}}

/* distressed comic edge accents without touching interaction layers */
.tab.active::before{content:"";position:absolute;left:-10px;right:-10px;top:-8px;height:3px;pointer-events:none;opacity:.7;background:linear-gradient(90deg,var(--fcc-accent) 0 16%,transparent 16% 23%,var(--fcc-accent-2) 23% 43%,transparent 43% 76%,var(--fcc-accent-3) 76% 90%,transparent 90%)}

.panel,.metric,.mini,.bookcard,.catalog-hero{
  color:#e9edef!important;background:linear-gradient(180deg,rgba(8,16,22,.98),rgba(5,11,15,.98))!important;border-color:#27343a!important;box-shadow:0 12px 30px rgba(0,0,0,.25)!important;
}
.panel{border-radius:10px!important;padding:16px!important}
.metric{border-radius:9px!important;padding:15px!important;position:relative;overflow:hidden}
.metric::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,var(--fcc-accent),transparent 70%);opacity:.65}
.metric .label{color:#9eaaaf!important;font-size:10px!important;letter-spacing:.08em!important}
.metric .value{color:#f7f8f6!important;font-size:25px!important}
.metric .sub{color:#8e9a9f!important}
.panelhead{margin-bottom:12px!important}
.panelhead h2,.panelhead h3{color:#f5f6f4!important;font-weight:820!important;letter-spacing:-.02em!important}
.panelhead h2::after,.panelhead h3::after{content:"";display:block;width:40px;height:2px;margin-top:6px;background:linear-gradient(90deg,var(--fcc-accent),transparent)}
.muted{color:#99a6ab!important}.tiny{color:#8f9ba0!important}

.input,.select,.textarea{
  background:#050c10!important;border-color:#2a373d!important;color:#edf1f1!important;border-radius:6px!important;box-shadow:none!important;
}
.input::placeholder,.textarea::placeholder{color:#6f7c82!important}
.input:focus,.select:focus,.textarea:focus{border-color:var(--fcc-accent)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--fcc-accent) 12%,transparent)!important}
.field label{color:#9eaaaf!important}
.select{color-scheme:dark}
.btn{
  border-color:#344148!important;background:#091116!important;color:#eef1f1!important;border-radius:6px!important;box-shadow:none!important;
}
.btn:hover{border-color:color-mix(in srgb,var(--fcc-accent) 58%,#344148)!important;background:#0d181e!important;transform:translateY(-1px)!important}
.btn.primary{border-color:var(--fcc-accent)!important;background:var(--fcc-accent)!important;color:#051014!important;font-weight:900!important}
.btn.primary:hover{filter:brightness(1.08)!important}
.btn.danger{color:#ff8c8c!important}
.badge{border:1px solid #2d3a40!important;background:#09151b!important;color:#cbd3d6!important;border-radius:5px!important}
.badge.good{border-color:rgba(113,212,91,.32)!important;background:rgba(113,212,91,.08)!important;color:#93e482!important}
.badge.warn{border-color:rgba(255,210,28,.34)!important;background:rgba(255,210,28,.08)!important;color:#ffe05c!important}
.badge.bad{border-color:rgba(255,98,98,.34)!important;background:rgba(255,98,98,.08)!important;color:#ff9696!important}
.status,.callout{background:#081116!important;border-color:#2d3a40!important;color:#bac4c8!important;border-radius:7px!important}
.callout.warning{border-left:3px solid var(--fcc-yellow)!important;background:rgba(255,210,28,.055)!important}

/* Tables */
.tablewrap{border-color:#27343a!important;background:#050b0f!important;border-radius:8px!important}
.table th{background:#091218!important;color:#aab5b9!important;border-bottom-color:#2a363c!important;font-size:9px!important}
.table td{border-bottom-color:#1e292f!important;color:#e4e9ea!important}
.table tr:hover td{background:#0a151b!important}
.cover{border-color:#3a464b!important;background:#111b20!important;border-radius:5px!important;box-shadow:0 5px 14px rgba(0,0,0,.3)!important}
.titlecell strong{color:#f6f7f5!important}.row-keynotes{color:#b2bcc0!important}.row-strategy{color:#8f9ca1!important}

/* Dashboard — yellow/cyan financial-vault feel */
#dashboard .vault-hero{
  border:1px solid #28353b!important;border-radius:10px!important;overflow:hidden!important;position:relative!important;
  background:linear-gradient(108deg,rgba(5,12,16,.98) 0 58%,rgba(8,18,22,.94)),radial-gradient(circle at 70% 36%,rgba(19,185,235,.12),transparent 25rem)!important;
  box-shadow:0 18px 45px rgba(0,0,0,.32)!important;
}
#dashboard .vault-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(135deg,transparent 0 55px,rgba(255,255,255,.012) 56px 57px)}
#dashboard .hero-kicker{color:var(--fcc-yellow)!important}
#dashboard .hero-copy h1{color:#fff!important;text-transform:none!important}
#dashboard .hero-copy h1 span{color:var(--fcc-cyan)!important}
#dashboard .hero-copy p{color:#9fabb0!important}
#dashboard .hero-pulse span{background:var(--fcc-green)!important}
#dashboard .portfolio-mix-panel{border-top:2px solid var(--fcc-cyan)!important}
#dashboard .grid.two>.panel:first-child{border-top:2px solid var(--fcc-magenta)!important}

/* Collection — card/catalog energy from the reference, but retains table/card toggle and all actions. */
#collection>.panel{border-top:2px solid var(--fcc-yellow)!important;position:relative!important}
#collection>.panel>.panelhead:first-child{padding:3px 0 12px!important;border-bottom:1px solid #243139!important}
#collection>.panel>.panelhead:first-child h2{display:inline-block!important;padding:5px 16px 4px!important;background:var(--fcc-yellow)!important;color:#090a09!important;transform:skew(-8deg);font-size:19px!important;text-transform:uppercase!important;letter-spacing:.04em!important}
#collection>.panel>.panelhead:first-child h2::after{display:none!important}
#collection .collection-market-pricing{border:1px solid #26343a!important;background:#071116!important;border-radius:7px!important;padding:9px 11px!important;margin:10px 0 13px!important}
#collection .toolbar{padding:11px!important;border:1px solid #26343a!important;background:#050b0f!important;border-radius:7px!important}
#collection .bookcard{border-radius:7px!important;border-color:#2c3a40!important;overflow:hidden!important;transition:.16s ease!important}
#collection .bookcard:hover{border-color:var(--fcc-accent)!important;box-shadow:0 16px 34px rgba(0,0,0,.4)!important}
#collection .bookcard .cover{border-radius:4px!important}
#collection .v414-collection-table{background:#050b0f!important}
#collection .v414-collection-table thead th{border-top:1px solid rgba(255,210,28,.24)!important}

/* Market / Suggested Price */
#pricing .pricing-grid>.panel:first-child{border-top:2px solid var(--fcc-magenta)!important}
#pricing .pricing-grid>.panel:nth-child(2){border-top:2px solid var(--fcc-cyan)!important}
#pricing .formula{background:#050b0f!important;border:1px solid #2a373d!important;color:var(--fcc-yellow)!important;border-radius:6px!important}
#pricing>.panel{border-top:2px solid var(--fcc-yellow)!important}

/* Sales */
#sold .sold-summary-grid>*{border-top:2px solid var(--fcc-magenta)!important}
#sold>.panel{border-top:2px solid var(--fcc-magenta)!important}
#sold .table th{color:#d8a2b9!important}

/* Grading */
#grading>.panel{border-top:2px solid var(--fcc-yellow)!important}
#grading .cia-ai-disclaimer{border-left-color:var(--fcc-yellow)!important}
#grading .bookcard{border-top:2px solid rgba(255,210,28,.7)!important}

/* Database */
#catalog .catalog-hero{border-top:2px solid var(--fcc-cyan)!important;background:linear-gradient(110deg,#07141b,#060c10)!important}
#catalog .catalog-hero .hero-kicker{color:var(--fcc-cyan)!important}
#catalog .catalog-search-panel{border-top:2px solid var(--fcc-yellow)!important}
#catalog .catalog-results-panel{border-top:2px solid var(--fcc-cyan)!important}
#catalog .catalog-detail-panel{border-top:2px solid var(--fcc-magenta)!important}
.catalog-attribution-footer{color:#7f8d92!important}
.catalog-attribution-footer a{color:var(--fcc-cyan)!important}

/* Import */
#import>.panel{border-top:2px solid var(--fcc-cyan)!important}
#import .import-drop{background:linear-gradient(135deg,rgba(19,185,235,.07),rgba(229,58,130,.035))!important;border-color:#33515d!important;border-radius:9px!important}
#import .import-drop-icon{color:var(--fcc-cyan)!important}
#import .import-step{background:#071116!important;border-color:#28363c!important}
#import .import-step.active{border-color:var(--fcc-cyan)!important;color:#fff!important}
#import .import-step.active span{background:var(--fcc-cyan)!important;color:#041016!important}

/* Marketplace + dynamically inserted content */
#marketplace .v19-catalog-hero{border-top:2px solid var(--fcc-magenta)!important}
#marketplace .v19-marketplace-subnav{background:#050b0f!important;border-color:#2b383e!important}
#marketplace .seg.active{background:var(--fcc-magenta)!important;color:#fff!important}
#marketplace .v19-market-card{background:#071116!important;border-color:#2b383e!important}

/* Membership/settings */
#membership>.panel:first-child,#settings>.panel:first-child{border-top:2px solid var(--fcc-yellow)!important}
#settings .panel:nth-child(even){border-top:1px solid rgba(19,185,235,.5)!important}
#settings .panel:nth-child(odd){border-top:1px solid rgba(229,58,130,.45)!important}

/* Footer-like copyright inserted by v50 JS */
.fcc-site-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:26px 0 0;padding:14px 4px 0;border-top:1px solid #1d292f;color:#748187;font-size:10px;letter-spacing:.03em}
.fcc-site-footer strong{color:#aeb9bd;font-weight:700}.fcc-site-footer .fcc-bars{display:inline-flex;gap:3px;vertical-align:-2px;margin-right:7px}.fcc-site-footer .fcc-bars i{display:block;width:18px;height:5px;transform:skew(-22deg)}.fcc-site-footer .fcc-bars i:nth-child(1){background:var(--fcc-cyan)}.fcc-site-footer .fcc-bars i:nth-child(2){background:var(--fcc-magenta)}.fcc-site-footer .fcc-bars i:nth-child(3){background:var(--fcc-yellow)}.fcc-site-footer .fcc-bars i:nth-child(4){background:#f0f0ec}

/* Desktop rail usability: preserve the full center application width; rails only occupy true spare viewport space. */
@media(max-width:1719px){.app::before,.app::after{display:none!important}}

@media(max-width:1100px){
  .topinner{grid-template-columns:1fr auto!important;grid-template-rows:auto auto!important;padding:9px 12px 7px!important}
  .topinner>.brand{grid-column:1;grid-row:1}.topinner>.cloud-user{grid-column:2;grid-row:1}.topinner>.tabs{grid-column:1/3;grid-row:2}
  .fcc-brand img{width:122px}.fcc-brand-copy{display:none}
  .content{padding:14px 12px 38px!important}
}

@media(max-width:760px){
  body{background:#030609!important}
  .topbar{position:sticky!important}
  .topinner{display:grid!important;grid-template-columns:1fr auto!important;gap:7px 10px!important;padding:8px 10px 6px!important}
  .topinner>.brand{grid-column:1;grid-row:1}.topinner>.cloud-user{grid-column:2;grid-row:1;width:auto!important;justify-content:flex-end!important}.topinner>.tabs{grid-column:1/3;grid-row:2}
  .fcc-brand img{width:106px!important}.cloud-user-email{display:none!important}.membership-top-badge{font-size:8px!important;padding:3px 5px!important}#signOutBtn{font-size:10px!important;padding:6px 8px!important}
  .tabs{margin-left:-2px!important;margin-right:-2px!important;scroll-padding-left:8px!important}
  .tabbtn{min-height:38px!important;padding:8px 9px!important;font-size:9px!important}.tabbtn::before{font-size:12px!important}
  .content{padding:12px 9px 34px!important}
  .panel{padding:13px!important;border-radius:8px!important}.metric{padding:12px!important}.metric .value{font-size:21px!important}
  .panelhead{flex-direction:column!important;align-items:stretch!important}.panelhead>.btnrow{width:100%!important}.panelhead>.btnrow .btn{flex:1!important}
  .toolbar{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}.toolbar .field.grow{grid-column:1/-1!important}.toolbar>.btn{width:100%!important}
  .btn{min-height:42px!important}.btn.small{min-height:36px!important}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  #collection .toolbar{grid-template-columns:1fr 1fr!important;padding:9px!important}#collection .toolbar .field.grow{grid-column:1/-1!important}
  .tablewrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
  .table{min-width:720px!important}
  #collection,#collectionTable,#collection .panel,#collection .tablewrap{overflow-x:visible!important}
  #collection .tablewrap{overflow-x:auto!important}
  .fcc-site-footer{flex-direction:column!important;align-items:flex-start!important}

  /* Mobile login becomes a clean, touch-friendly Four Color card rather than squeezing desktop art. */
  .auth-gate{min-height:100dvh!important;padding:22px 14px 28px!important;display:flex!important;align-items:center!important;justify-content:center!important;background-image:radial-gradient(circle at 20% 0,rgba(19,185,235,.15),transparent 24rem),radial-gradient(circle at 90% 100%,rgba(229,58,130,.12),transparent 24rem),#020507!important;background-size:auto!important}
  .auth-gate::before{background:repeating-linear-gradient(135deg,transparent 0 46px,rgba(255,255,255,.014) 47px 48px)!important}
  .auth-shell,.auth-shell-v4011{position:relative!important;left:auto!important;top:auto!important;transform:none!important;width:min(100%,520px)!important;margin:auto!important}
  .auth-card,.auth-card-v4011{padding:25px 18px 22px!important;border-radius:14px!important}
  .auth-card .auth-mobile-brand,.auth-card-v4011 .auth-mobile-brand{display:flex!important;justify-content:center!important;margin:0 0 22px!important;height:72px!important}
  .auth-mobile-brand>*{display:none!important}
  .auth-mobile-brand::before{content:"";display:block;width:140px;height:72px;background:url('/assets/fourcolor/fcc-logo-2026.png') center/contain no-repeat}
  .auth-card h1,.auth-card-v4011 h1{font-size:23px!important}.auth-card p,.auth-card-v4011 p{font-size:13px!important}
  .auth-card-v4011 .input,.auth-primary-cta,.auth-secondary-cta{min-height:48px!important}
}

@media(max-width:520px){
  .cards{grid-template-columns:1fr!important}
  .grid.metrics{grid-template-columns:1fr 1fr!important;gap:8px!important}
  .grid.two,.pricing-grid,.catalog-workspace{grid-template-columns:1fr!important}
  .chartbox{height:245px!important}
  #dashboard .vault-hero{padding:14px!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr!important}
  .auth-card,.auth-card-v4011{padding:23px 16px 20px!important}
  .fcc-remember-row{align-items:center!important}
}


/* v40.30.3 stability/readability recovery */
/* v40.30.4 navigation/logo update is appended below. */
html,body{font-size:16px!important}
body{line-height:1.48!important}
.content,.panel,.bookcard,.modal{font-size:15px!important}
.muted.tiny,.tiny{font-size:13px!important;line-height:1.45!important}
.tabbtn{font-size:13px!important;min-height:42px!important;padding:10px 12px!important}
.btn,.select,.input,.textarea,button{font-size:14px!important}
.input,.select,.textarea{min-height:42px!important}
.table{font-size:14px!important}
.table th{font-size:12px!important}
.panelhead h2,.panelhead h3{font-size:18px!important}
/* Avoid giant accent compositor layers on Chrome/Edge. */
body::before,.app::before,.app::after,.tab.active::before,.metric::after{will-change:auto!important;transform:none!important;filter:none!important;mask-image:none!important;-webkit-mask-image:none!important}
.app::before,.app::after{contain:paint!important}
#grading,#grading *{background-clip:padding-box}
@media(max-width:900px){
  html,body{font-size:16px!important}
  .content{padding:12px 12px 34px!important}
  .app::before,.app::after{display:none!important}
  .tabbtn{font-size:12.5px!important;min-height:44px!important}
  .btn,.input,.select,.textarea{font-size:16px!important}
  .muted.tiny,.tiny{font-size:13px!important}
}


/* v40.30.4 navigation + 2026 logo update */
#tabs [data-tab="sold"],#tabs [data-tab="membership"],#tabs [data-tab="admin"]{display:none!important}
#tabs [data-tab="pricing"]{display:inline-flex!important}
.fcc-brand img{max-height:74px!important;object-fit:contain!important;object-position:left center!important}
@media(max-width:1100px){.fcc-brand img{max-height:58px!important}}
@media(max-width:760px){.fcc-brand img{max-height:50px!important}}


/* v40.30.5 dashboard centering + Discover + 125% zoom utility */
body[data-fcc-tab="discover"]{--fcc-accent:#13b9eb;--fcc-accent-2:#ffd21c;--fcc-accent-3:#e53a82}

/* Bring the primary dashboard closer to the header and keep it optically centered. */
.content{padding-top:10px!important}
#dashboard{width:min(1460px,100%)!important;margin-inline:auto!important}
#dashboard .vault-hero{margin-top:0!important}

/* Slightly larger desktop navigation while preserving horizontal scroll on smaller screens. */
.tabbtn,.fcc-menu-action{
  position:relative!important;flex:0 0 auto!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;
  min-height:46px!important;padding:11px 14px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#c8d0d3!important;
  font:800 14px/1 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;
  letter-spacing:.012em!important;text-transform:uppercase!important;white-space:nowrap!important;transition:.16s ease!important;
}
.tabbtn::before,.fcc-menu-action::before{display:inline-grid;place-items:center;width:17px;color:#e9edeb;font-size:14px;opacity:.9}
.tabbtn[data-tab="discover"]::before{content:"✦"}
.fcc-menu-action::before{content:"⌕";font-size:17px}
.tabbtn:hover,.fcc-menu-action:hover{background:rgba(255,255,255,.045)!important;color:#fff!important}
.fcc-menu-action.active,.fcc-menu-action[aria-pressed="true"]{color:#fff!important;background:rgba(19,185,235,.055)!important}
.fcc-menu-action.active::before,.fcc-menu-action[aria-pressed="true"]::before{color:var(--fcc-cyan)!important}
.fcc-menu-action[aria-pressed="true"]::after{content:"";position:absolute;left:9px;right:9px;bottom:0;height:2px;background:var(--fcc-cyan);box-shadow:0 0 12px rgba(19,185,235,.55)}

/* Discover gets its own energetic but related Four Color treatment. */
.fcc-discover-shell{width:min(1180px,100%);margin:0 auto}
.fcc-discover-hero{min-height:390px;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(270px,.65fr);gap:28px;align-items:center;overflow:hidden!important;border-top:2px solid var(--fcc-cyan)!important;background:
  radial-gradient(circle at 82% 20%,rgba(255,210,28,.12),transparent 23rem),
  radial-gradient(circle at 20% 85%,rgba(229,58,130,.09),transparent 24rem),
  linear-gradient(135deg,#061119,#050a0e 68%)!important}
.fcc-discover-copy{position:relative;z-index:2;padding:20px 14px}
.fcc-discover-copy .hero-kicker{color:var(--fcc-cyan)!important;letter-spacing:.16em!important}
.fcc-discover-copy h2{font-size:clamp(34px,5vw,62px)!important;line-height:.98!important;letter-spacing:-.045em!important;margin:8px 0 18px!important;text-transform:uppercase!important}
.fcc-discover-fact{font-size:clamp(18px,2vw,24px)!important;line-height:1.46!important;color:#e8edef!important;max-width:800px}
.fcc-discover-fact strong{color:var(--fcc-yellow)}
.fcc-discover-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:22px}
.fcc-discover-burst{width:min(320px,100%);aspect-ratio:1;display:grid;place-content:center;text-align:center;transform:rotate(-5deg);clip-path:polygon(50% 0,60% 24%,83% 9%,79% 34%,100% 39%,78% 52%,94% 72%,69% 71%,66% 100%,49% 78%,30% 98%,30% 72%,4% 80%,22% 55%,0 44%,25% 36%,14% 13%,40% 25%);background:var(--fcc-yellow);color:#070706;box-shadow:0 25px 55px rgba(0,0,0,.34)}
.fcc-discover-burst span{font-size:24px;font-weight:950;letter-spacing:.12em}.fcc-discover-burst b{font-size:48px;line-height:.9;font-weight:1000;letter-spacing:-.06em}.fcc-discover-burst small{font-size:14px;margin-top:10px;font-weight:800}
.fcc-discover-grid>.panel:first-child{border-top:2px solid var(--fcc-magenta)!important}.fcc-discover-grid>.panel:last-child{border-top:2px solid var(--fcc-yellow)!important}

/* Simulate browser-style 125% zoom without growing beyond the viewport. */
body.fcc-zoom-125 .app{zoom:1.25!important;width:80%!important;margin:0!important}
body.fcc-zoom-125 .app::before,body.fcc-zoom-125 .app::after{display:none!important}

@media(max-width:1100px){
  .tabbtn,.fcc-menu-action{font-size:13px!important;min-height:44px!important;padding:10px 11px!important}
  .fcc-discover-hero{grid-template-columns:1fr!important;min-height:0!important}.fcc-discover-burst{width:240px;margin:0 auto 10px}
}
@media(max-width:760px){
  .content{padding-top:8px!important}
  .tabbtn,.fcc-menu-action{font-size:11px!important;min-height:42px!important;padding:9px 10px!important}
  .fcc-discover-copy{padding:8px 2px}.fcc-discover-copy h2{font-size:38px!important}.fcc-discover-fact{font-size:18px!important}
  .fcc-discover-burst{width:200px}.fcc-discover-burst b{font-size:38px}
}