/* ===================================================================================
   J&K Brackets Pro — Tournament Directory
   Shared stylesheet for every /tournaments/ page.

   The palette, the typography and the nav are lifted from the existing homepage so the
   directory reads as part of the same site, not a bolt-on. Where the marketing pages use
   heavy gradients and glow, these pages are deliberately calmer: a bowler scanning twenty
   tournaments on a phone needs contrast and rhythm, not atmosphere.

   ACCESSIBILITY NOTES (WCAG 2.2 AA):
     --muted  #a99a78 on --black #040302  ≈ 6.6:1   safe for body text
     --gold   #d6a62f on --black          ≈ 8.9:1   safe for body text and links
     --dim    #74684d on --black          ≈ 3.6:1   large text / decoration ONLY
   Status is never carried by colour alone: every coloured badge also carries a word.
   =================================================================================== */

:root {
  --black: #040302;
  --black2: #090704;
  --panel: #100d08;
  --panel2: #17120a;
  --panel3: #211805;
  --gold: #d6a62f;
  --gold2: #f0ca4b;
  --gold3: #7f5b16;
  --text: #f8f1df;
  --muted: #a99a78;
  --dim: #74684d;
  --red: #ff8a8a;
  --red-bg: #2a0d0d;
  --amber: #f0ca4b;
  --amber-bg: #2a2007;
  --green: #45d477;
  --green-bg: #0c2415;
  --border: #31240c;
  --radius: 12px;
  --shadow: 0 12px 34px rgba(0, 0, 0, .45);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  font-family: Arial, Helvetica, sans-serif;
  background: var(--black);
  color: var(--text);
  line-height: 1.6;
  font-size: 16px;
  overflow-x: hidden;
}

a { color: var(--gold); }
a:hover { color: var(--gold2); }

/* A visible, high-contrast focus ring everywhere. Never removed. */
:focus-visible {
  outline: 3px solid var(--gold2);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Respect a reduced-motion preference: no transitions, no smooth scroll, no spinners. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--gold); color: #050403; padding: 12px 18px;
  font-weight: 900; border-radius: 0 0 8px 0;
}
.skip-link:focus { left: 0; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ─────────────────────────────────────────────────────────────────────────── nav */

.td-nav {
  position: sticky; top: 0; z-index: 60;
  background: rgba(4, 3, 2, .96);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
}
.td-nav-in {
  max-width: 1140px; margin: 0 auto; padding: 0 18px;
  height: 62px; display: flex; align-items: center; gap: 16px;
}
.td-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; flex-shrink: 0; }
.td-logo-dot {
  width: 30px; height: 30px; border: 1px solid var(--gold3); border-radius: 50%;
  display: grid; place-items: center;
  background: radial-gradient(circle, #2d2109, #080604);
  font-weight: 900; color: var(--gold); font-size: 12px;
}
.td-logo-name {
  font-size: 14px; font-weight: 900; color: var(--gold); letter-spacing: 1.8px;
  white-space: nowrap;
}
.td-nav-links { display: flex; align-items: center; gap: 16px; margin-left: auto; }
.td-nav-links a {
  font-size: 12px; text-transform: uppercase; letter-spacing: 1px;
  text-decoration: none; color: var(--muted); font-weight: 800; white-space: nowrap;
}
.td-nav-links a:hover, .td-nav-links a[aria-current="page"] { color: var(--gold2); }
.td-nav-cta {
  background: linear-gradient(135deg, var(--gold2), var(--gold));
  color: #090704 !important; padding: 9px 15px; border-radius: 9px;
}
@media (max-width: 720px) {
  .td-nav-in { height: 56px; gap: 10px; }
  .td-logo-name { font-size: 11px; letter-spacing: 1.2px; }
  .td-nav-links { gap: 10px; }
  .td-nav-links a.td-hide-sm { display: none; }
  .td-nav-links a { font-size: 11px; }
  .td-nav-cta { padding: 8px 12px; }
}

/* Below about 430px the wordmark, the "Find Tournaments" link and the gold call to action
   no longer fit on one line, and because every one of them is `white-space: nowrap` the
   row simply overflowed — which made the WHOLE PAGE scroll sideways on a 320px phone,
   including all the content below it that fitted perfectly well.

   The wordmark goes first: the JK badge beside it already links home and already says who
   this is, so dropping the words costs nothing a visitor needs. The remaining link and the
   call to action are then given room to shrink rather than being allowed to push out. */
@media (max-width: 430px) {
  .td-nav-in { padding: 0 12px; gap: 8px; }
  .td-logo-name { display: none; }
  .td-nav-links { gap: 8px; min-width: 0; }
  .td-nav-links a { font-size: 10.5px; letter-spacing: .6px; min-width: 0; }
  .td-nav-cta { padding: 8px 10px; border-radius: 8px; }
}

/* The last resort, on the narrowest phones still in use. A directory whose header pushes
   its own content off-screen is worse than one whose header is plain. */
@media (max-width: 340px) {
  .td-nav-links a:not(.td-nav-cta) { display: none; }
  .td-wrap { padding-left: 14px; padding-right: 14px; }
}

/* Nothing anywhere may make the document itself scroll horizontally. This is the backstop
   for the class of bug above: a single wide element should clip or scroll inside its own
   container, never drag the page with it. */
html, body { overflow-x: hidden; max-width: 100%; }

/* ─────────────────────────────────────────────────────────────────────── layout */

.td-wrap { max-width: 1140px; margin: 0 auto; padding: 26px 18px 80px; }
.td-narrow { max-width: 780px; }

.td-crumb { font-size: 12.5px; color: var(--muted); margin-bottom: 16px; }
.td-crumb a { text-decoration: none; }
.td-crumb a:hover { text-decoration: underline; }
.td-crumb span[aria-current] { color: var(--text); }

.td-eyebrow {
  font-size: 11px; font-weight: 900; letter-spacing: 3px; text-transform: uppercase;
  color: var(--gold); margin-bottom: 9px;
}
h1 {
  font-family: 'Arial Black', Arial, sans-serif;
  font-size: clamp(27px, 4.6vw, 42px); line-height: 1.08; letter-spacing: -1px;
  margin-bottom: 12px; text-transform: uppercase;
}
h1 .lc { text-transform: none; letter-spacing: -.5px; }
h2 {
  font-family: 'Arial Black', Arial, sans-serif;
  font-size: clamp(20px, 3vw, 27px); line-height: 1.15; margin: 34px 0 12px;
  color: var(--gold2);
}
h3 { font-size: 17px; font-weight: 900; margin: 22px 0 8px; color: var(--text); }
p { margin: 0 0 13px; }
.td-lead { font-size: 17px; color: var(--muted); max-width: 720px; margin-bottom: 22px; }
.td-slogan {
  font-size: 11px; letter-spacing: 3px; font-weight: 900; color: var(--gold3);
  text-transform: uppercase; margin-top: 6px;
}

.td-panel {
  background: linear-gradient(150deg, var(--panel), var(--black2));
  border: 1px solid var(--border); border-radius: var(--radius);
  padding: 20px; margin-bottom: 18px;
}
.td-panel-tight { padding: 15px; }

/* ─────────────────────────────────────────────────────────────────────── buttons */

.td-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  text-decoration: none; font-size: 14.5px; font-weight: 900;
  border-radius: 10px; padding: 13px 20px; border: 2px solid transparent;
  cursor: pointer; font-family: inherit; transition: .15s ease;
  /* 44px minimum touch target on every control. */
  min-height: 46px;
}
.td-btn-primary {
  background: linear-gradient(135deg, var(--gold2), var(--gold)); color: #050403;
  box-shadow: 0 8px 22px rgba(214, 166, 47, .18);
}
.td-btn-primary:hover:not(:disabled) { transform: translateY(-1px); color: #050403; }
.td-btn-secondary { border-color: var(--gold3); color: var(--gold2); background: rgba(0, 0, 0, .2); }
.td-btn-secondary:hover:not(:disabled) { border-color: var(--gold); color: var(--gold2); }
.td-btn-quiet { border-color: var(--border); color: var(--muted); background: transparent; }
.td-btn-quiet:hover:not(:disabled) { color: var(--text); border-color: var(--gold3); }
.td-btn-danger { border-color: #6b2020; color: var(--red); background: rgba(0, 0, 0, .2); }
.td-btn-danger:hover:not(:disabled) { border-color: #a13030; }
.td-btn-sm { padding: 10px 14px; font-size: 13px; min-height: 44px; border-radius: 8px; }
.td-btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.td-btn-row { display: flex; gap: 10px; flex-wrap: wrap; }

/* ───────────────────────────────────────────────────────────────────────── forms */

.td-field { margin-bottom: 16px; }
.td-field label, .td-legend {
  display: block; font-size: 13px; font-weight: 800; color: var(--text);
  margin-bottom: 6px; letter-spacing: .3px;
}
.td-req { color: var(--gold2); font-weight: 900; }
.td-opt { color: var(--dim); font-weight: 600; font-size: 12px; text-transform: none; letter-spacing: 0; }
.td-hint { font-size: 12.5px; color: var(--muted); margin: 5px 0 0; line-height: 1.5; }

input[type=text], input[type=email], input[type=tel], input[type=url],
input[type=date], input[type=time], input[type=number], input[type=search],
select, textarea {
  width: 100%; font-family: inherit; font-size: 16px; /* 16px stops iOS zooming on focus */
  color: var(--text); background: var(--black2);
  border: 1px solid var(--border); border-radius: 9px;
  padding: 12px 13px; min-height: 46px;
}
textarea { min-height: 110px; resize: vertical; line-height: 1.55; }
select {
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--gold) 50%),
                    linear-gradient(135deg, var(--gold) 50%, transparent 50%);
  background-position: calc(100% - 19px) 21px, calc(100% - 13px) 21px;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 36px;
}
input:focus, select:focus, textarea:focus { border-color: var(--gold); }
input::placeholder, textarea::placeholder { color: var(--dim); }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] {
  border-color: #b04a4a; background: #1a0a0a;
}

.td-err {
  display: block; font-size: 12.5px; color: var(--red); margin-top: 5px; font-weight: 700;
}
.td-err:empty { display: none; }

fieldset { border: 0; margin: 0 0 16px; padding: 0; }
.td-checks { display: grid; gap: 8px; }
.td-check {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 11px 13px; background: var(--black2);
  border: 1px solid var(--border); border-radius: 9px; cursor: pointer;
  min-height: 46px;
}
.td-check:hover { border-color: var(--gold3); }
.td-check input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--gold); flex-shrink: 0; }
.td-check span { font-size: 14px; line-height: 1.45; }
.td-check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }

.td-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.td-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
@media (max-width: 640px) {
  .td-grid-2, .td-grid-3 { grid-template-columns: 1fr; gap: 0; }
  .td-grid-2 > *, .td-grid-3 > * { margin-bottom: 16px; }
}

/* Never rendered visibly; a bot filling it is a bot. */
.td-hp {
  position: absolute !important; left: -9999px !important;
  width: 1px; height: 1px; overflow: hidden;
}

/* ────────────────────────────────────────────────────────────────────── messages */

.td-msg {
  border-radius: 10px; padding: 14px 16px; margin-bottom: 16px;
  font-size: 14.5px; line-height: 1.55; border-left: 4px solid;
}
.td-msg strong { display: block; margin-bottom: 4px; }
.td-msg-info { background: var(--panel2); border-color: var(--gold); color: var(--text); }
.td-msg-good { background: var(--green-bg); border-color: var(--green); color: #cdf3dd; }
.td-msg-warn { background: var(--amber-bg); border-color: var(--amber); color: #f4e6bd; }
.td-msg-bad { background: var(--red-bg); border-color: #c94f4f; color: #f6d5d5; }
.td-msg ul { margin: 8px 0 0 18px; }
.td-msg li { margin-bottom: 4px; }

/* ──────────────────────────────────────────────────────────────────────── badges */

.td-badge {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 900; letter-spacing: .8px; text-transform: uppercase;
  padding: 4px 9px; border-radius: 999px; border: 1px solid;
  white-space: nowrap;
  /* A badge is short, so nowrap is right — but it must never be the reason a card is
     wider than the phone holding it. Shrinking is allowed; overflowing is not. */
  max-width: 100%; min-width: 0;
}

/* The longest badge by far is "Demo — not a real tournament", and it is the one badge that
   absolutely must not be clipped or pushed off-screen: it is the warning that stops
   somebody driving to a bowling centre for an event that does not exist. Below 400px it
   gets its own line and is allowed to wrap onto two, rather than sitting beside the date
   and running off the edge. */
.td-card-status { margin-bottom: 6px; min-width: 0; }

@media (max-width: 430px) {
  .td-card-status .td-badge {
    white-space: normal; text-align: left; line-height: 1.35;
    border-radius: 10px; display: block; width: fit-content; max-width: 100%;
  }
}
.td-badge-gold { color: var(--gold2); border-color: var(--gold3); background: rgba(214, 166, 47, .1); }
.td-badge-green { color: #7ce6a4; border-color: #2c6b45; background: rgba(69, 212, 119, .1); }
.td-badge-red { color: #ffa5a5; border-color: #8e3535; background: rgba(255, 120, 120, .12); }
.td-badge-amber { color: #f4d98a; border-color: #7a6220; background: rgba(240, 202, 75, .1); }
.td-badge-grey { color: var(--muted); border-color: var(--border); background: rgba(255, 255, 255, .03); }

.td-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.td-pill {
  font-size: 12px; font-weight: 700; color: var(--muted);
  border: 1px solid var(--border); background: rgba(255, 255, 255, .02);
  padding: 4px 10px; border-radius: 999px;
}

/* ───────────────────────────────────────────────────────────────── result cards */

.td-results { display: grid; gap: 14px; }

.td-card {
  display: grid; grid-template-columns: 108px 1fr; gap: 16px;
  background: linear-gradient(150deg, var(--panel), var(--black2));
  border: 1px solid var(--border); border-radius: var(--radius);
  padding: 16px; position: relative;
}
.td-card:hover { border-color: var(--gold3); }
.td-card-thumb {
  width: 108px; height: 140px; border-radius: 8px; overflow: hidden;
  background: var(--panel3); border: 1px solid var(--border);
  display: grid; place-items: center;
}
.td-card-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.td-card-thumb .td-noflyer {
  font-size: 10px; color: var(--dim); text-align: center; padding: 8px;
  text-transform: uppercase; letter-spacing: 1px; font-weight: 800; line-height: 1.5;
}
.td-card-body { min-width: 0; }
.td-card h3 { margin: 0 0 5px; font-size: 19px; line-height: 1.25; }
.td-card h3 a { text-decoration: none; color: var(--text); }
.td-card h3 a:hover { color: var(--gold2); }
.td-card-when { font-size: 14.5px; color: var(--gold2); font-weight: 800; margin-bottom: 5px; }
.td-card-where { font-size: 14px; color: var(--muted); margin-bottom: 8px; }
.td-card-where b { color: var(--text); font-weight: 700; }
.td-card-dist {
  display: inline-block; font-size: 12.5px; font-weight: 900; color: var(--gold);
  margin-left: 6px;
}
.td-card-excerpt { font-size: 13.5px; color: var(--muted); margin: 8px 0 10px; line-height: 1.5; }
.td-card-meta {
  display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; color: var(--muted);
  margin-bottom: 10px;
}
.td-card-meta b { color: var(--text); }
.td-card-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

@media (max-width: 560px) {
  .td-card { grid-template-columns: 76px 1fr; gap: 12px; padding: 13px; }
  .td-card-thumb { width: 76px; height: 98px; }
  .td-card h3 { font-size: 17px; }
}

/* ─────────────────────────────────────────────────────────────────── search form */

.td-search-bar { margin-bottom: 18px; }
.td-search-row { display: grid; grid-template-columns: 1.1fr 1fr auto; gap: 10px; align-items: end; }
@media (max-width: 720px) { .td-search-row { grid-template-columns: 1fr; } }

.td-filters { border: 1px solid var(--border); border-radius: var(--radius); background: var(--panel); }
.td-filters > summary {
  cursor: pointer; padding: 14px 16px; font-weight: 900; font-size: 14px;
  color: var(--gold2); list-style: none; display: flex; align-items: center; gap: 8px;
  min-height: 46px;
}
.td-filters > summary::-webkit-details-marker { display: none; }
.td-filters > summary::before { content: "▸"; color: var(--gold); transition: transform .15s; }
.td-filters[open] > summary::before { transform: rotate(90deg); }
.td-filters-body { padding: 0 16px 16px; border-top: 1px solid var(--border); padding-top: 16px; }

.td-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  flex-wrap: wrap; margin: 20px 0 14px;
}
.td-count { font-size: 14.5px; color: var(--muted); }
.td-count b { color: var(--text); }

.td-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 14px; }
.td-chip {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 12.5px; font-weight: 700; color: var(--gold2);
  background: rgba(214, 166, 47, .1); border: 1px solid var(--gold3);
  border-radius: 999px; padding: 5px 8px 5px 12px;
}
.td-chip button {
  background: none; border: 0; color: var(--gold2); cursor: pointer;
  font-size: 16px; line-height: 1; padding: 2px 4px; border-radius: 4px;
}
.td-chip button:hover { color: var(--text); }

.td-pager { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 26px; }
.td-pager span { font-size: 14px; color: var(--muted); }

/* ────────────────────────────────────────────────────────────────── detail page */

.td-detail-head { margin-bottom: 22px; }
.td-status-strip { margin-bottom: 16px; }

.td-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.td-fact {
  background: var(--black2); border: 1px solid var(--border);
  border-radius: 10px; padding: 13px 15px;
}
.td-fact dt {
  font-size: 11px; text-transform: uppercase; letter-spacing: 1.2px;
  color: var(--muted); font-weight: 800; margin-bottom: 5px;
}
.td-fact dd { font-size: 16px; font-weight: 700; color: var(--text); line-height: 1.4; }
.td-fact dd small { display: block; font-size: 12.5px; color: var(--muted); font-weight: 400; margin-top: 3px; }

.td-table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.td-table caption { text-align: left; font-size: 12px; color: var(--muted); padding-bottom: 8px; }
.td-table th, .td-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--border); }
.td-table th {
  font-size: 11px; text-transform: uppercase; letter-spacing: 1px;
  color: var(--gold); font-weight: 900;
}
.td-table tr:last-child td { border-bottom: 0; }
.td-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.td-prose { font-size: 15.5px; line-height: 1.72; color: #e6dcc4; }
.td-prose p { margin-bottom: 13px; }
.td-prose p:last-child { margin-bottom: 0; }

.td-flyer-strip { display: flex; gap: 12px; flex-wrap: wrap; }
.td-flyer-thumb {
  border: 1px solid var(--border); border-radius: 10px; overflow: hidden;
  background: var(--panel3); cursor: pointer; padding: 0; width: 132px;
}
.td-flyer-thumb img { width: 132px; height: 172px; object-fit: cover; display: block; }
.td-flyer-thumb .td-pdfmark {
  width: 132px; height: 172px; display: grid; place-items: center;
  color: var(--gold); font-weight: 900; font-size: 13px; letter-spacing: 1px;
}

dialog.td-modal {
  border: 1px solid var(--gold3); border-radius: 14px; background: var(--panel);
  color: var(--text); padding: 0; max-width: min(960px, 94vw); width: 100%;
  max-height: 92vh; box-shadow: var(--shadow);
}
dialog.td-modal::backdrop { background: rgba(0, 0, 0, .82); }
.td-modal-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 16px; border-bottom: 1px solid var(--border);
}
.td-modal-head h2 { margin: 0; font-size: 17px; color: var(--gold2); }
.td-modal-body { padding: 16px; overflow: auto; max-height: calc(92vh - 130px); }
.td-modal-body img { max-width: 100%; height: auto; display: block; margin: 0 auto; }
.td-modal-body iframe { width: 100%; height: 74vh; border: 0; background: #fff; border-radius: 8px; }

/* ───────────────────────────────────────────────────────────────────── manage */

.td-mine { display: grid; gap: 12px; }
.td-mine-row {
  display: flex; gap: 14px; align-items: flex-start; flex-wrap: wrap;
  background: linear-gradient(150deg, var(--panel), var(--black2));
  border: 1px solid var(--border); border-radius: var(--radius); padding: 15px;
}
.td-mine-main { flex: 1 1 260px; min-width: 0; }
.td-mine-row h3 { margin: 0 0 4px; font-size: 17px; }
.td-mine-actions { display: flex; gap: 7px; flex-wrap: wrap; align-items: center; }

.td-steps { display: flex; gap: 6px; margin-bottom: 20px; flex-wrap: wrap; }
.td-step {
  flex: 1 1 90px; padding: 9px 10px; border-radius: 8px; text-align: center;
  font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .8px;
  border: 1px solid var(--border); color: var(--dim); background: var(--black2);
}
.td-step[aria-current="step"] { border-color: var(--gold); color: var(--gold2); background: var(--panel3); }
.td-step.done { color: var(--muted); border-color: var(--gold3); }

/* ────────────────────────────────────────────────────────────────────── states */

.td-empty { text-align: center; padding: 44px 20px; }
.td-empty h2 { color: var(--gold2); margin-top: 0; }
.td-empty p { color: var(--muted); max-width: 480px; margin: 0 auto 18px; }

.td-skeleton { display: grid; gap: 14px; }
.td-skel-card {
  height: 172px; border-radius: var(--radius);
  background: linear-gradient(100deg, var(--panel) 30%, var(--panel2) 50%, var(--panel) 70%);
  background-size: 300% 100%; animation: td-shimmer 1.3s linear infinite;
  border: 1px solid var(--border);
}
@keyframes td-shimmer { to { background-position: -150% 0; } }
@media (prefers-reduced-motion: reduce) { .td-skel-card { animation: none; } }

.td-spinner {
  width: 18px; height: 18px; border: 2px solid rgba(255, 255, 255, .25);
  border-top-color: #050403; border-radius: 50%;
  animation: td-spin .7s linear infinite; display: inline-block;
}
@keyframes td-spin { to { transform: rotate(360deg); } }

/* ────────────────────────────────────────────────────────────────────── footer */

.td-foot {
  border-top: 1px solid var(--border); background: var(--black2);
  padding: 30px 18px; margin-top: 40px;
}
.td-foot-in {
  max-width: 1140px; margin: 0 auto; font-size: 13px; color: var(--muted); line-height: 1.7;
}
.td-foot-in a { text-decoration: none; }
.td-foot-in a:hover { text-decoration: underline; }
.td-foot-links { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-bottom: 14px; }
.td-foot-legal { font-size: 12px; color: var(--dim); border-top: 1px solid var(--border); padding-top: 14px; }

.td-disclaimer {
  font-size: 13px; color: var(--muted); line-height: 1.6;
  border: 1px dashed var(--border); border-radius: 10px; padding: 13px 15px; margin-top: 24px;
}

@media print {
  .td-nav, .td-foot, .td-btn, .td-filters, .td-toolbar, .skip-link { display: none !important; }
  body { background: #fff; color: #000; }
  .td-panel, .td-fact, .td-card { border-color: #999; background: #fff; }
  a[href]::after { content: " (" attr(href) ")"; font-size: 10px; color: #555; }
}


/* ── Where a listing came from ────────────────────────────────────────────────────────
   Discovered listings carry a panel crediting and linking the page they were read from.
   It is deliberately quiet rather than alarming: the listing is not suspect, it is just
   second-hand, and the visual weight should match that. The left rule is gold so it reads
   as part of the page furniture rather than as a warning. */
.td-provenance {
  border-left: 3px solid var(--gold3);
  font-size: 14.5px;
  line-height: 1.65;
}
.td-provenance h2 { letter-spacing: .01em; }
.td-provenance p { margin: 0 0 10px; color: var(--muted); }
.td-provenance p b { color: var(--text); }
.td-provenance a { color: var(--gold2); }

.td-verified { font-size: 14.5px; color: var(--muted); }
.td-verified .td-badge { margin-right: 8px; }

/* Result cards say it in one word, because a list is not the place for a paragraph. */
.td-card-source {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11.5px; color: var(--muted); margin-top: 6px;
}
.td-card-source::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  background: var(--gold3); flex: none;
}