/* MundaApp · District Pulse — prices with their evidence attached. */
.pl-wrap { max-width: 720px; margin: 0 auto; padding: 4px 0 40px; }
.pl-head { padding: 6px 0 10px; }
.pl-head h1 { font-family: var(--display, Georgia, serif); font-size: 26px; margin: 0 0 6px; color: var(--ink, #14231c); }
.pl-head p { margin: 0; color: var(--muted, #5d6b64); font-size: 14px; line-height: 1.5; }

.pl-queue {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  background: #fdf6e6; border: 1px solid #ecd9a8; color: #7a5b12;
  border-radius: 10px; padding: 9px 12px; font-size: 12.5px; margin-bottom: 10px;
}
.pl-queue svg { width: 14px; height: 14px; flex: none; }
.pl-link { background: none; border: 0; padding: 0; font-size: 12.5px; font-weight: 700;
  color: #7a5b12; text-decoration: underline; cursor: pointer; }

.pl-chips { display: flex; gap: 7px; overflow-x: auto; padding: 2px 2px 10px; scrollbar-width: none; }
.pl-chips::-webkit-scrollbar { display: none; }
.pl-chip { flex: none; padding: 7px 12px; font-size: 12.5px; font-weight: 600; border-radius: 99px;
  border: 1px solid var(--line, #e7e1d6); background: transparent; color: var(--muted, #5d6b64); cursor: pointer; }
.pl-chip.on { background: var(--green-700, #0e5a3a); border-color: var(--green-700, #0e5a3a); color: #fff; }

.pl-meta { font-size: 12px; color: var(--muted, #5d6b64); margin: 4px 0 10px; }
.pl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; align-items: start; }
@media (max-width: 480px) { .pl-grid { grid-template-columns: 1fr; } .pl-card-acts .pl-mini { flex: 1 1 auto; text-align: center; } }
.pl-card { border: 1px solid var(--line, #e7e1d6); border-radius: 14px; background: var(--card, #fff); padding: 12px; }
.pl-crop { font-size: 12px; text-transform: capitalize; letter-spacing: .02em; color: var(--muted, #5d6b64); }
.pl-price { font-size: 23px; font-weight: 800; color: var(--ink, #14231c); margin: 4px 0 2px; }
.pl-price span { font-size: 12px; font-weight: 600; color: var(--muted, #5d6b64); margin-left: 2px; }
.pl-sub { font-size: 11.5px; color: var(--muted, #5d6b64); }
.pl-warn { font-size: 11px; color: #8a4b12; margin-top: 4px; }
.pl-fresh { font-size: 11px; color: var(--faint, #8a968f); margin-top: 6px; }

.pl-empty { display: grid; justify-items: center; gap: 6px; text-align: center; padding: 34px 18px;
  border: 1px dashed var(--line, #e7e1d6); border-radius: 14px; color: var(--muted, #5d6b64); }
.pl-empty svg { width: 26px; height: 26px; opacity: .6; }
.pl-empty b { color: var(--ink, #14231c); font-size: 14px; }
.pl-empty span { font-size: 12.5px; line-height: 1.5; max-width: 36ch; }

.pl-panel { border: 1px solid var(--line, #e7e1d6); border-radius: 14px; background: var(--card, #fff);
  padding: 14px; margin: 10px 0 14px; }
.pl-panel h2 { margin: 0 0 6px; font-size: 15px; color: var(--ink, #14231c); }
.pl-small { font-size: 11.5px; color: var(--muted, #5d6b64); margin: 0 0 10px; line-height: 1.5; }
.pl-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pl-fields label { font-size: 11.5px; font-weight: 600; color: var(--muted, #5d6b64); }
.pl-fields input, .pl-fields select { display: block; width: 100%; margin-top: 4px; padding: 9px 10px;
  font-size: 13px; border: 1px solid var(--line, #e7e1d6); border-radius: 9px;
  background: var(--paper, #fbfaf6); color: var(--ink, #14231c); }

.pl-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.pl-btn { display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px; font-size: 13px;
  font-weight: 700; border-radius: 10px; border: 1px solid var(--line, #e7e1d6);
  background: transparent; color: var(--ink, #14231c); cursor: pointer; }
.pl-btn.is-go { background: var(--green-700, #0e5a3a); border-color: var(--green-700, #0e5a3a); color: #fff; }
.pl-btn svg { width: 15px; height: 15px; }

@media (max-width: 380px) { .pl-fields { grid-template-columns: 1fr; } }

/* ---- v2: window, filter, sort ------------------------------------------- */
.pl-tools { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 0 2px 8px; }
.pl-search { display: flex; align-items: center; gap: 6px; flex: 1 1 150px; min-width: 140px;
  border: 1px solid var(--line, #e7e1d6); border-radius: 99px; background: var(--card, #fff); padding: 6px 11px; }
.pl-search svg { width: 15px; height: 15px; color: var(--faint, #8a968f); flex: none; }
.pl-search input { border: 0; outline: 0; background: transparent; font-size: 13px; width: 100%; color: var(--ink, #14231c); }
.pl-seg { display: flex; border: 1px solid var(--line, #e7e1d6); border-radius: 99px; overflow: hidden; background: var(--card, #fff); }
.pl-seg-btn { border: 0; background: transparent; padding: 7px 10px; font-size: 12px; font-weight: 600;
  color: var(--muted, #5d6b64); cursor: pointer; }
.pl-seg-btn.on { background: var(--green-100, #dcebe1); color: var(--green-800, #0b4029); }
.pl-select { border: 1px solid var(--line, #e7e1d6); border-radius: 99px; background: var(--card, #fff);
  font-size: 12px; font-weight: 600; padding: 7px 10px; color: var(--muted, #5d6b64); }
.pl-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding-bottom: 8px; }
.pl-row .pl-link { display: inline-flex; align-items: center; gap: 5px; }
.pl-row .pl-link svg { width: 14px; height: 14px; }

/* ---- v2: a card with a direction ---------------------------------------- */
.pl-card-top { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.pl-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; background: #c9c3b4; }
.pl-dot--good { background: #2e9163; }
.pl-dot--ok { background: #d79a2b; }
.pl-dot--wide { background: #c2542d; }
.pl-dot--thin { background: #b9b2a2; }
.pl-trend { display: block; font-size: 11.5px; font-weight: 700; margin-top: 5px; }
.pl-trend i { font-style: normal; font-weight: 500; color: var(--faint, #8a968f); }
.pl-trend--up { color: #1f7a4c; }
.pl-trend--down { color: #a8441f; }
.pl-trend--flat, .pl-trend--none { color: var(--muted, #5d6b64); font-weight: 500; }
.pl-spark-wrap { height: 30px; margin: 6px 0 2px; color: var(--green-500, #2e9163); }
.pl-spark { width: 100%; height: 30px; }
.pl-conf { color: var(--muted, #5d6b64); }
.pl-badges { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 6px; }
.pl-badge { font-size: 10.5px; font-weight: 700; padding: 2px 7px; border-radius: 99px;
  background: var(--green-50, #eff6f0); color: var(--green-800, #0b4029); }
.pl-badge--warn { background: #fbe9df; color: #8a4b12; }
.pl-card-acts { display: flex; gap: 5px; margin-top: 9px; flex-wrap: wrap; }
.pl-mini { font-size: 11px; font-weight: 700; padding: 6px 9px; white-space: nowrap; border-radius: 7px; cursor: pointer;
  border: 1px solid var(--line, #e7e1d6); background: transparent; color: var(--muted, #5d6b64); }
.pl-mini:hover { border-color: var(--green-500, #2e9163); color: var(--green-800, #0b4029); }

/* ---- v2: reading the numbers -------------------------------------------- */
.pl-insight, .pl-mine { border: 1px solid var(--line, #e7e1d6); border-radius: 14px;
  background: var(--card, #fff); padding: 14px; margin-top: 14px; }
.pl-insight h2, .pl-mine h2 { margin: 0 0 8px; font-size: 15px; color: var(--ink, #14231c); }
.pl-insight ul { margin: 0; padding-left: 18px; }
.pl-insight li { font-size: 13px; line-height: 1.55; color: var(--ink-2, #3d4c45); margin-bottom: 7px; }
.pl-mine p { margin: 0 0 4px; font-size: 13.5px; }
.pl-mine .pl-badge { margin-left: 4px; }

.pl-alert-list { list-style: none; margin: 10px 0 0; padding: 0; }
.pl-alert-list li { display: flex; justify-content: space-between; gap: 10px; align-items: center;
  font-size: 12.5px; padding: 7px 0; border-top: 1px solid var(--line-soft, #efece4); text-transform: capitalize; }
.pl-fired { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; font-size: 12.5px;
  background: #eef7f0; border: 1px solid #cfe6d6; color: #14512f; border-radius: 10px;
  padding: 9px 12px; margin-bottom: 10px; }
.pl-fired svg { width: 14px; height: 14px; }

/* ---- the way in from the feed -------------------------------------------
   Built like the Community Intelligence card: the flag ribbon on the top
   edge, the mark in a warm tile, the name in Fraunces, one gold badge. Here
   the photograph is the work itself, so the scrim does the reading.
 */
.pl-entry { position: relative; display: block; text-decoration: none; overflow: hidden;
  border-radius: 20px; margin: 0 0 12px; min-height: 172px;
  background: #06251A; isolation: isolate;
  box-shadow: 0 20px 36px -28px rgba(6, 30, 20, .9), 0 2px 6px rgba(10, 30, 20, .12); }
.pl-entry-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  object-position: 50% 58%; z-index: -2; }
.pl-entry::after { content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(96deg, rgba(5, 28, 19, .96) 0%, rgba(5, 30, 20, .88) 46%, rgba(5, 28, 19, .3) 100%),
    linear-gradient(180deg, rgba(4, 22, 15, .5), rgba(4, 22, 15, .2) 40%, rgba(3, 20, 14, .8)); }

/* the app's ribbon, the same four bands as the CI card */
.pl-flag { position: absolute; top: 0; left: 0; right: 0; height: 5px; display: flex; z-index: 3; }
.pl-flag u { display: block; text-decoration: none; }
.pl-flag u:nth-child(1) { flex: 0 0 58%; background: #198A00; }
.pl-flag u:nth-child(2) { flex: 0 0 14%; background: #DE2010; }
.pl-flag u:nth-child(3) { flex: 0 0 14%; background: #111; }
.pl-flag u:nth-child(4) { flex: 1 1 auto; background: #EF7D00; }

.pl-entry-in { position: relative; display: flex; flex-direction: column; gap: 6px;
  padding: 24px 16px 16px; min-height: 172px; }
.pl-entry-top { display: flex; align-items: center; gap: 9px; }
.pl-logo { width: 34px; height: 34px; border-radius: 11px; overflow: hidden; flex: none;
  background: #F7F1DF;
  box-shadow: 0 8px 18px -12px rgba(0,0,0,.9), inset 0 0 0 1px rgba(255,255,255,.5); }
.pl-logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pl-mark { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.pl-mark b { font-family: var(--display, Georgia, serif); font-size: 16px; font-weight: 600;
  letter-spacing: -.015em; color: #FFFDF6; text-shadow: 0 1px 10px rgba(0,0,0,.5); }
.pl-mark i { font-style: normal; font-size: 8px; letter-spacing: .2em; text-transform: uppercase;
  font-weight: 600; color: rgba(247, 230, 190, .82); margin-top: 2px; }
.pl-badge { margin-left: auto; flex: none;
  font: 700 9.5px/1 var(--display, Georgia, serif); letter-spacing: .08em;
  padding: 6px 8px; border-radius: 8px; color: #2A1500;
  background: linear-gradient(150deg, #FFC061, #DFA03C 68%, #B9831F);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 8px 16px -10px rgba(0,0,0,.9); }
.pl-entry-tags { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 4px; }
.pl-entry-tags i { font-style: normal; font-size: 8.5px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: rgba(255,255,255,.93); background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.22); padding: 3px 6.5px; border-radius: 999px; }
.pl-entry-go { position: absolute; right: 13px; bottom: 13px; width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center; background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.28);
  color: #fff; font-size: 15px; line-height: 1; }
/* the sub sits under the brand row, not inside .pl-entry-tx any more */
.pl-entry-in > .pl-sub { font-size: 11.5px; line-height: 1.46; color: rgba(255,255,255,.86); max-width: 40ch; }
