/* Supporters wall widgets (supporters/wall.js). Dark UI, coffee-yellow accent. */
.tpsw-month { --tpsw-gold: #ffdd00; --tpsw-amber: #ff9f1c; color: #fff; }
.tpsw-month-title { font-weight: 700; font-size: 1rem; line-height: 1.3; font-variant-numeric: tabular-nums; }
.tpsw-month-sub { font-size: .82rem; color: rgba(255, 255, 255, .62); margin-top: 2px; font-variant-numeric: tabular-nums; }
.tpsw-days { display: flex; gap: 3px; margin: 10px 0 6px; }
.tpsw-day { position: relative; flex: 1 1 0; min-width: 0; height: 18px; border-radius: 4px; background: rgba(255, 255, 255, .09); overflow: hidden; }
.tpsw-day > i { position: absolute; inset: 0; transform-origin: left center; transform: scaleX(var(--f, 1));
    background: linear-gradient(180deg, var(--tpsw-gold), var(--tpsw-amber)); animation: tpsw-pour .5s ease-out both; }
.tpsw-day.tpsw-today { box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .75); }
.tpsw-day.tpsw-weekend { margin-right: 4px; }
@keyframes tpsw-pour { from { transform: scaleX(0); } }
@media (prefers-reduced-motion: reduce) { .tpsw-day > i { animation: none; } }
.tpsw-month-foot { font-size: .82rem; color: rgba(255, 255, 255, .78); }
.tpsw-next::before { content: "\2615\FE0F  "; }
.tpsw-met .tpsw-month-title { color: var(--tpsw-gold); }
.tpsw-met .tpsw-day > i { background: linear-gradient(180deg, #ffe866, var(--tpsw-gold)); }
.tpsw-next-month { color: rgba(255, 255, 255, .7) !important; font-size: .8rem; text-decoration: underline; text-underline-offset: 2px; }
.tpsw-next-month:hover { color: #fff !important; }
.tpsw-compact .tpsw-month-title { font-size: .88rem; }
.tpsw-compact .tpsw-day { height: 10px; border-radius: 3px; }
.tpsw-compact .tpsw-days { gap: 2px; margin: 6px 0 4px; }
.tpsw-compact .tpsw-day.tpsw-weekend { margin-right: 2px; }
.tpsw-compact .tpsw-month-foot, .tpsw-compact .tpsw-month-sub { font-size: .76rem; }

.tpsw-av { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%;
    font-weight: 700; font-size: .85rem; color: #fff; background: #555; }
.tpsw-av-anon { background: rgba(255, 221, 0, .16); color: #ffdd00; font-size: 1rem; }
.tpsw-name { font-weight: 600; color: #fff; }
.tpsw-cups { color: rgba(255, 255, 255, .72); }
.tpsw-ago { color: rgba(255, 255, 255, .45); font-size: .78rem; }

.tpsw-proof { display: flex; align-items: flex-start; gap: 8px; font-size: .82rem; line-height: 1.35; }
.tpsw-proof .tpsw-av { width: 24px; height: 24px; font-size: .72rem; }
.tpsw-proof-msg { display: block; color: rgba(255, 255, 255, .7); font-style: italic; margin-top: 2px; overflow-wrap: anywhere; }

.tpsw-card { display: flex; gap: 12px; padding: 12px 14px; border-radius: 12px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .07); }
.tpsw-card-body { min-width: 0; flex: 1; }
.tpsw-card-top { line-height: 1.35; }
.tpsw-card-msg { margin-top: 4px; color: rgba(255, 255, 255, .85); overflow-wrap: anywhere; white-space: pre-line; }
.tpsw-pill { display: inline-block; margin-left: 6px; padding: 0 7px; border-radius: 999px; font-size: .7rem; background: rgba(255, 221, 0, .15); color: #ffdd00; vertical-align: 1px; }
.tpsw-empty { color: rgba(255, 255, 255, .6); margin: 0; }

.tpsw-board { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.tpsw-rank { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; background: rgba(255, 255, 255, .035); }
.tpsw-rank .tpsw-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tpsw-rank-n { width: 1.4em; text-align: center; font-weight: 700; color: rgba(255, 255, 255, .5); font-variant-numeric: tabular-nums; }
.tpsw-rank-1 .tpsw-rank-n { color: #ffdd00; }
.tpsw-rank-2 .tpsw-rank-n { color: #d8dde6; }
.tpsw-rank-3 .tpsw-rank-n { color: #e0a36b; }
.tpsw-rank-1 { background: rgba(255, 221, 0, .08); }
.tpsw-rank-c { color: #ffdd00; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }

.tpsw-strip-head { font-size: .8rem; color: rgba(255, 255, 255, .62); margin-bottom: 6px; }
.tpsw-strip-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.tpsw-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 3px 10px 3px 3px; border-radius: 999px; background: rgba(255, 255, 255, .06); font-size: .8rem; }
.tpsw-chip .tpsw-av { width: 22px; height: 22px; font-size: .7rem; }
.tpsw-chip .tpsw-name { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 9em; }
.tpsw-chip-x { color: #ffdd00; font-weight: 700; }
.tpsw-strip-all { font-size: .8rem; color: #ffdd00 !important; margin-left: 2px; }
