/* screens/trust.css: the trust ladder card (2026-09-06, portal-trust builder)
   Prefix: .tr-  ·  tokens only, no raw sizes, no new colours.
   The tier colour is ONE token trio picked by [data-tier], so a tier reads the
   same on the canvas panel, the posts screen and the ads screen. */

.tr-card{
  /* the default (tier "new") is the neutral ink wash: a fresh account is not a
     warning and not a success, it is simply young */
  --tr-ink: var(--muted);
  --tr-soft: var(--tint-2);
  --tr-line: var(--line-2);
  --tr-bold: var(--muted-2);
  padding:var(--sp-16);
  display:flex;
  flex-direction:column;
  gap:var(--sp-14);
  border-color:var(--tr-line);
}
.tr-card[data-tier="restricted"]{--tr-ink:var(--danger);--tr-soft:var(--danger-soft);--tr-line:var(--danger-line);--tr-bold:var(--danger)}
.tr-card[data-tier="new"]{--tr-ink:var(--muted);--tr-soft:var(--tint-2);--tr-line:var(--line-2);--tr-bold:var(--muted-2)}
.tr-card[data-tier="warming"]{--tr-ink:var(--warn);--tr-soft:var(--warn-soft);--tr-line:var(--warn-line);--tr-bold:var(--warn-bold)}
.tr-card[data-tier="trusted"]{--tr-ink:var(--ok);--tr-soft:var(--live-soft);--tr-line:var(--live-line);--tr-bold:var(--live)}

.tr-head{display:flex;align-items:center;gap:var(--sp-10)}
.tr-head__x{display:flex;align-items:center;gap:var(--sp-8);flex:1;min-width:0;flex-wrap:wrap}
.tr-dot{
  width:10px;height:10px;flex:none;border-radius:var(--r-circle);
  background:var(--tr-bold);box-shadow:0 0 0 4px var(--tr-soft);
}
.tr-head__n{display:flex;flex-direction:column;gap:var(--sp-2);min-width:0}
.tr-cap{font-size:var(--fs-meta);font-weight:700;color:var(--muted-2);line-height:var(--lh-tight)}
.tr-tier{font-size:var(--fs-lg);font-weight:700;color:var(--ink);line-height:var(--lh-tight)}
.tr-man{color:var(--tr-ink);background:var(--tr-soft);border-color:var(--tr-line)}
.tr-when{font-size:var(--fs-meta);font-weight:600;color:var(--muted-2);white-space:nowrap}
.tr-lead{font-size:var(--fs-sm);font-weight:500;color:var(--muted);line-height:var(--lh-body);margin:0}
/* the engine's evidence sentence, under the tier's own paragraph */
.tr-why{
  margin:0;font-size:var(--fs-sm);font-weight:600;color:var(--ink);line-height:var(--lh-body);
  padding:var(--sp-10) var(--sp-12);border-radius:var(--r-md);
  background:var(--tr-soft);border:1px solid var(--tr-line);
}
.tr-why[hidden]{display:none}

.tr-sec{display:flex;flex-direction:column;gap:var(--sp-8)}
.tr-lab{font-size:var(--fs-meta);font-weight:700;color:var(--muted-2)}

/* signals ------------------------------------------------------------------ */
.tr-sig__g{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:var(--sp-8)}
.tr-sig__c{
  display:flex;flex-direction:column;gap:var(--sp-2);
  padding:var(--sp-10) var(--sp-12);
  background:var(--card-2);border:1px solid var(--line);border-radius:var(--r-md);
}
.tr-sig__c b{font-size:var(--fs-base);font-weight:700;color:var(--ink);line-height:var(--lh-tight)}
.tr-sig__c span{font-size:var(--fs-meta);font-weight:600;color:var(--muted-2);line-height:var(--lh-tight)}
.tr-sig__c--low{background:var(--tr-soft);border-color:var(--tr-line)}

/* the short rows: allowed today, and the next step's requirements ----------- */
.tr-rows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-6)}
.tr-row{display:flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-sm);font-weight:600;color:var(--ink)}
.tr-row__i{width:16px;height:16px;flex:none;display:inline-flex;align-items:center;justify-content:center}
.tr-row__i svg{width:16px;height:16px}
.tr-row--yes .tr-row__i{color:var(--ok)}
.tr-row--no .tr-row__i{color:var(--muted-2)}
.tr-row--no .tr-row__t{color:var(--muted)}
.tr-row__t{flex:1;min-width:0}
.tr-row__v{
  font-size:var(--fs-meta);font-weight:600;color:var(--muted-2);
  text-align:right;flex:none;max-width:52%;
}

.tr-next__l{margin:0;font-size:var(--fs-sm);font-weight:700;color:var(--ink)}

/* the last refusal, in the engine's own words ------------------------------ */
.tr-ref{
  padding:var(--sp-10) var(--sp-12);
  background:var(--danger-soft);border:1px solid var(--danger-line);border-radius:var(--r-md);
  gap:var(--sp-4);
}
.tr-ref .tr-lab{color:var(--danger)}
.tr-ref__t{margin:0;font-size:var(--fs-sm);font-weight:600;color:var(--ink);line-height:var(--lh-body)}

/* the manual-mode switch --------------------------------------------------- */
.tr-man__row{
  display:flex;align-items:center;gap:var(--sp-12);
  padding-top:var(--sp-12);border-top:1px solid var(--line);
}
.tr-man__row > div{flex:1;min-width:0}
.tr-man__l{font-size:var(--fs-md);font-weight:700;color:var(--ink)}
.tr-man__n{font-size:var(--fs-hint);font-weight:500;color:var(--muted-2);line-height:var(--lh-body);margin-top:var(--sp-2)}
.tr-card--manual{background:var(--card-2)}

/* the pack link and the "I published it" modal ----------------------------- */
.tr-pack{text-decoration:none}
.tr-did__e{
  margin:var(--sp-8) 0 0;font-size:var(--fs-hint);font-weight:600;color:var(--danger);
}
.tr-did__e[hidden]{display:none}

/* the dated warm-up checklist ---------------------------------------------- */
.tr-warm{padding:var(--sp-16);display:flex;flex-direction:column;gap:var(--sp-10)}
.tr-warm__n{margin:0}
.tr-warm__l{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-10)}
.tr-warm__i{display:flex;align-items:flex-start;gap:var(--sp-10)}
.tr-warm__b{
  width:20px;height:20px;flex:none;margin-top:1px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:var(--r-circle);border:1px solid var(--line-2);
  background:var(--card-2);color:transparent;
}
.tr-warm__b svg{width:13px;height:13px}
.tr-warm__i--done .tr-warm__b{background:var(--live-soft);border-color:var(--live-line);color:var(--ok)}
.tr-warm__i--now .tr-warm__b{border-color:var(--warn-line);background:var(--warn-soft)}
.tr-warm__h{display:flex;align-items:baseline;gap:var(--sp-8);flex-wrap:wrap}
.tr-warm__h b{font-size:var(--fs-sm);font-weight:700;color:var(--ink)}
.tr-warm__h span{font-size:var(--fs-meta);font-weight:600;color:var(--muted-2)}
.tr-warm__i p{margin:var(--sp-2) 0 0;font-size:var(--fs-sm);font-weight:500;color:var(--muted);line-height:var(--lh-body)}
.tr-warm__i--done p{color:var(--muted-2)}

/* the manual-pack lead block (posts screen in the new tier, ads screen) ----- */
.tr-lead__box{
  padding:var(--sp-16);display:flex;flex-direction:column;gap:var(--sp-10);
  border-color:var(--line-2);background:var(--card-2);
}
.tr-lead__box h2{margin:0;font-size:var(--fs-lg);font-weight:700;color:var(--ink);line-height:var(--lh-tight)}
.tr-lead__box p{margin:0;font-size:var(--fs-sm);font-weight:500;color:var(--muted);line-height:var(--lh-body)}
.tr-lead__box .tr-lead__when{font-weight:700;color:var(--ink)}
.tr-lead__acts{display:flex;flex-wrap:wrap;gap:var(--sp-8)}

@media (max-width: 560px){
  .tr-card,.tr-warm,.tr-lead__box{padding:var(--sp-12)}
  .tr-row{flex-wrap:wrap}
  .tr-row__v{max-width:100%;text-align:left;width:100%;padding-left:24px}
  .tr-sig__g{grid-template-columns:repeat(2,minmax(0,1fr))}
}
