/* ============================================================
   CARMAboard — app skin
   Additive only. No existing rule is edited; everything here is
   an override appended after the app's own stylesheet. Deleting
   this file restores the previous appearance exactly.

   Measured problems this fixes, on /app at 1984px viewport:
     · logo rendered 101x23 from a 422x96 asset, in a 220px rail
     · .col capped at 640px, so .catboard sat at 560px inside an
       824px column — four 133px tiles, descriptions wrapping to
       five lines each. That cramping is what read as "classifieds".
     · a "Get set up — n of 4" bar (.fsetup) duplicating the
       "n of 4" already in the right rail
   ============================================================ */
:root{ --cb-g:linear-gradient(90deg,#6F1FA3 0%,#C93678 38%,#F36B21 72%,#FF9700 100%); }

/* ---------- 1. logo: .sidelogo IS the <img>, not a wrapper ---------- */
img.sidelogo{
  width:164px!important;height:auto!important;max-width:none!important;
  padding:0!important;margin:20px 0 20px 22px!important;display:block!important;
}

/* ---------- 2. sidebar ---------- */
.side{background:#fff!important;border-right:1px solid #EAE3EF!important}
.snav a,.snav .n{
  border-radius:9px!important;padding:9px 12px!important;font-weight:600!important;
  transition:background .16s ease,color .16s ease;
}
.snav a:hover,.snav .n:hover{background:#F5EEFA!important;color:#6F1FA3!important}

/* ---------- 3. width: the actual cause of the cramped look ---------- */
.col{max-width:1040px!important}
.col > .sub,.col > p,.phead + .sub{max-width:66ch!important}  /* keep prose readable */
.shell{max-width:1560px!important}
.catboard{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;width:100%!important;max-width:none!important;
}
@media (max-width:1100px){.catboard{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:620px){.catboard{grid-template-columns:1fr!important}}

/* ---------- 4. participant-type tiles ---------- */
.ctile{
  position:relative;overflow:hidden;background:#fff!important;
  border:1px solid #EAE3EF!important;border-radius:16px!important;
  padding:20px 18px 18px!important;
  box-shadow:0 1px 2px rgba(26,10,40,.04),0 8px 24px rgba(26,10,40,.05)!important;
  transition:transform .28s cubic-bezier(.22,.9,.24,1),box-shadow .28s ease,border-color .28s ease;
}
.ctile::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--cb-g)}
.ctile:hover{
  transform:translateY(-4px);border-color:#DCCFE6!important;
  box-shadow:0 4px 10px rgba(26,10,40,.06),0 22px 44px rgba(111,31,163,.14)!important;
}
@media (prefers-reduced-motion:reduce){.ctile,.ctile:hover{transition:none;transform:none}}
.cico{
  width:40px!important;height:40px!important;border-radius:11px!important;
  display:flex!important;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#F5EEFA,#FBEAE1)!important;margin-bottom:13px!important;
}
.cico svg{width:20px!important;height:20px!important;stroke:#6F1FA3!important;color:#6F1FA3!important}
.ctn{
  font-size:16px!important;font-weight:650!important;letter-spacing:-.01em!important;
  color:#1A1A2E!important;margin-bottom:6px!important;line-height:1.2!important;
}
.ctd{font-size:13px!important;line-height:1.5!important;color:#5C5C72!important}
/* one quiet line, not four grey ones repeating that the market is empty */
.ctc{
  display:block!important;margin-top:12px!important;padding:0!important;background:none!important;
  font-size:12px!important;font-weight:600!important;letter-spacing:0!important;
  text-transform:none!important;color:#B82D6A!important;
}

/* ---------- 5. drop the duplicated setup nag ---------- */
.fsetup{display:none!important}

/* ---------- 6. right rail ---------- */
.rmod{
  background:#fff!important;border:1px solid #EAE3EF!important;border-radius:14px!important;
  padding:18px 18px 16px!important;margin-bottom:14px!important;
  box-shadow:0 1px 2px rgba(26,10,40,.04)!important;
}
.rmod .eyebrow{color:#B82D6A!important;font-weight:700!important;letter-spacing:.15em!important}

/* ---------- 7. type + primary action ---------- */
.phead,.sech{letter-spacing:-.022em!important}
.btn.a{
  background:var(--cb-g)!important;border:0!important;color:#fff!important;
  box-shadow:0 8px 20px rgba(111,31,163,.28)!important;
}
body{background:#F7F5FA!important}