/* Base styles copied from smallism.org (assets/site.css) so Swapshop reads as part of the same family.
   Swapshop additions are at the end. */
:root {
  --bg:#fdfdfb; --fg:#1c1c1a; --muted:#63635e; --rule:#e2e1da;
  --card:#ffffff; --accent:#8a5a2b; --accent2:#6b431d;
  --shadow:0 1px 2px rgba(0,0,0,.05), 0 6px 20px -8px rgba(0,0,0,.12);
  --font:system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; --headfont:system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg:#15161a; --fg:#e8e8e4; --muted:#9a9a94; --rule:#2c2e34;
    --card:#1c1e23; --accent:#d9a066; --accent2:#e8c096;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 20px -8px rgba(0,0,0,.6);
  }
}
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--fg); font-family:var(--font);
  font-size:18px; line-height:1.65; -webkit-font-smoothing:antialiased; }
.wrap { width:min(100% - 2.5rem, 68rem); margin-inline:auto; }
a { color:var(--accent2); text-underline-offset:.15em; text-decoration-thickness:.06em; }
a:hover { color:var(--accent); }
img,video { max-width:100%; height:auto; border-radius:6px; }
.skip { position:absolute; left:-9999px; }
.skip:focus { left:1rem; top:1rem; background:var(--card); padding:.6rem 1rem;
  border-radius:6px; z-index:100; box-shadow:var(--shadow); }

/* header */
.topbar { border-bottom:1px solid var(--rule); background:var(--bg);
  position:sticky; top:0; z-index:50; }
.bar { display:flex; align-items:center; gap:1.25rem; min-height:4rem; flex-wrap:wrap; }
.brand { font-family:var(--headfont); font-weight:700; font-size:1.15rem;
  letter-spacing:-.01em; text-decoration:none; color:var(--fg); margin-right:auto; }
nav { display:flex; gap:1.1rem; flex-wrap:wrap; }
nav a { font-size:.86rem; text-transform:uppercase; letter-spacing:.07em;
  font-weight:600; text-decoration:none; color:var(--muted); padding:.35rem 0;
  border-bottom:2px solid transparent; white-space:nowrap; }
nav a:hover { color:var(--fg); }
nav a.active { color:var(--accent2); border-bottom-color:var(--accent); }
.burger { display:none; }

/* hero */
.hero { padding:4.5rem 0 3rem; border-bottom:1px solid var(--rule);
  background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 7%, var(--bg)), var(--bg)); }
.hero h1 { font-family:var(--headfont); font-size:clamp(2.2rem,6vw,3.4rem);
  line-height:1.1; margin:0 0 .6rem; letter-spacing:-.02em; }
.hero .tagline { margin:0; font-size:1.15rem; color:var(--muted); max-width:44rem; }

main { padding:2.75rem 0 4rem; }
h1.pagetitle { font-family:var(--headfont); font-size:clamp(1.9rem,4.5vw,2.6rem);
  margin:.2rem 0 1.5rem; letter-spacing:-.02em; line-height:1.15; }
.secheading { font-family:var(--headfont); font-size:1rem; text-transform:uppercase;
  letter-spacing:.1em; color:var(--muted); margin:3rem 0 1.25rem;
  padding-bottom:.5rem; border-bottom:1px solid var(--rule); font-weight:700; }
.secheading a { color:inherit; text-decoration:none; }
.secheading a:hover { color:var(--accent); }

.crumbs { font-size:.82rem; color:var(--muted); margin-bottom:1.5rem;
  text-transform:uppercase; letter-spacing:.06em; }
.crumbs a { color:var(--muted); text-decoration:none; }
.crumbs a:hover { color:var(--accent); }
.crumbs span { opacity:.45; margin:0 .35rem; }

/* article */
.post h1 { font-family:var(--headfont); font-size:clamp(1.9rem,4.6vw,2.75rem);
  line-height:1.15; letter-spacing:-.02em; margin:.2rem 0 1.75rem; max-width:34ch; }
.prose { max-width:38rem; }
.prose.lead { font-size:1.08rem; color:var(--muted); max-width:44rem; }
.prose p { margin:0 0 1.35rem; }
.prose h2,.prose h3,.prose h4,.prose h5 { font-family:var(--headfont);
  line-height:1.25; margin:2.5rem 0 .9rem; letter-spacing:-.01em; }
.prose h2 { font-size:1.6rem; } .prose h3 { font-size:1.3rem; }
.prose h4 { font-size:1.12rem; } .prose h5 { font-size:1rem; }
.prose ul,.prose ol { margin:0 0 1.35rem; padding-left:1.4rem; }
.prose li { margin:.4rem 0; }
.prose blockquote { margin:1.75rem 0; padding:.25rem 0 .25rem 1.4rem;
  border-left:3px solid var(--accent); color:var(--muted); font-style:italic; }
.prose blockquote p:last-child { margin-bottom:0; }
.prose img,.prose video { display:block; margin:1.75rem auto; box-shadow:var(--shadow); }
.prose table { border-collapse:collapse; width:100%; margin:1.75rem 0; font-size:.94rem; }
.prose td,.prose th { border:1px solid var(--rule); padding:.6rem .75rem; text-align:left; }
.prose hr { border:0; border-top:1px solid var(--rule); margin:2.5rem 0; }

/* listings */
.cards,.tiles { list-style:none; padding:0; margin:0; display:grid; gap:1.1rem; }
.cards { grid-template-columns:repeat(auto-fill,minmax(19rem,1fr)); }
.tiles { grid-template-columns:repeat(auto-fill,minmax(15rem,1fr)); }
.card,.tile { background:var(--card); border:1px solid var(--rule);
  border-radius:10px; padding:1.35rem; box-shadow:var(--shadow);
  transition:transform .15s ease, border-color .15s ease; }
.card:hover,.tile:hover { transform:translateY(-2px); border-color:var(--accent); }
.card h3,.tile h3 { font-family:var(--headfont); margin:0 0 .5rem;
  font-size:1.12rem; line-height:1.3; letter-spacing:-.01em; }
.card h3 a,.tile h3 a { color:var(--fg); text-decoration:none; }
.card h3 a:hover,.tile h3 a:hover { color:var(--accent2); }
.card p,.tile p { margin:0; font-size:.92rem; color:var(--muted); line-height:1.55; }
.tile .count { display:block; margin-top:.75rem; font-size:.75rem;
  text-transform:uppercase; letter-spacing:.08em; color:var(--accent2); font-weight:600; }

footer { border-top:1px solid var(--rule); padding:2.5rem 0 3.5rem;
  font-size:.88rem; color:var(--muted); }
footer p { margin:.2rem 0; }
.muted { color:var(--muted); }

@media (max-width:44rem) {
  body { font-size:17px; }
  .bar { min-height:3.5rem; }
  .burger { display:flex; flex-direction:column; gap:4px; cursor:pointer; padding:.4rem; }
  .burger span { width:22px; height:2px; background:var(--fg); border-radius:2px; }
  nav { display:none; width:100%; flex-direction:column; gap:0;
    padding-bottom:.75rem; }
  #navtoggle:checked ~ nav { display:flex; }
  nav a { padding:.6rem 0; border-bottom:1px solid var(--rule); }
  nav a.active { border-bottom-color:var(--rule); }
  .hero { padding:3rem 0 2.25rem; }
  main { padding:2rem 0 3rem; }
}
@media (prefers-reduced-motion: reduce) {
  * { animation:none !important; transition:none !important; }
  html { scroll-behavior:auto; }
}

/* ---- Swapshop additions ---- */
.brand small { font-weight:500; color:var(--muted); font-size:.8rem; margin-left:.4rem;
  letter-spacing:.02em; }
.brand small a { color:inherit; text-decoration:none; }
.badge { display:inline-block; font-size:.75rem; text-transform:uppercase; letter-spacing:.08em;
  font-weight:700; color:var(--accent2); border:1px solid var(--accent); border-radius:999px;
  padding:.15rem .7rem; margin-bottom:1rem; }
.steps { counter-reset:step; }
.steps .card h3::before { counter-increment:step; content:counter(step) ". "; color:var(--accent2); }

nav .navform { margin:0; display:flex; }
nav .navform button { font:inherit; font-size:.86rem; text-transform:uppercase; letter-spacing:.07em;
  font-weight:600; color:var(--muted); background:none; border:0; padding:.35rem 0; cursor:pointer;
  border-bottom:2px solid transparent; }
nav .navform button:hover { color:var(--fg); }

/* forms */
.form { max-width:32rem; display:flex; flex-direction:column; gap:.35rem; margin:0 0 2rem; }
.form label { display:flex; flex-direction:column; font-weight:600; font-size:.95rem; margin-top:.75rem; }
.form label small { font-weight:400; color:var(--muted); font-size:.82rem; }
.form label.check { flex-direction:row; align-items:center; gap:.6rem; font-weight:400; margin-top:.5rem; }
.form input:not([type=checkbox]):not([type=radio]), .form textarea, .form select {
  font:inherit; font-size:1rem; color:var(--fg); background:var(--card); margin-top:.3rem;
  border:1px solid var(--rule); border-radius:8px; padding:.6rem .75rem; width:100%; }
.form input:focus, .form textarea:focus { outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent); }
.form fieldset { border:1px solid var(--rule); border-radius:8px; padding:.5rem 1rem 1rem; margin:.75rem 0 0; }
.form legend { font-weight:600; font-size:.95rem; padding:0 .3rem; }
.form button { align-self:flex-start; margin-top:1.25rem; }
.inline-form { flex-direction:row; flex-wrap:wrap; align-items:flex-end; gap:1rem; max-width:none; }
.inline-form label { margin-top:0; }
.inline-form button { margin-top:0; }
.field-error { color:#b3261e; font-size:.85rem; }
.field-error:empty { display:none; }
.note { background:color-mix(in srgb, var(--accent) 6%, var(--card)); border:1px solid var(--rule);
  border-radius:8px; padding:.75rem 1rem; margin-top:1rem; font-size:.9rem; }
.note p { margin:.3rem 0; }

.button { display:inline-block; font:inherit; font-size:.95rem; font-weight:600; cursor:pointer;
  background:var(--accent); color:#fff; border:1px solid var(--accent); border-radius:8px;
  padding:.55rem 1.2rem; text-decoration:none; }
.button:hover { background:var(--accent2); border-color:var(--accent2); color:#fff; }
.button.secondary { background:transparent; color:var(--accent2); }
.button.secondary:hover { background:color-mix(in srgb, var(--accent) 10%, transparent); color:var(--accent2); }
.button.small { font-size:.8rem; padding:.3rem .8rem; }

.alert { border:1px solid var(--rule); border-left:4px solid var(--accent); background:var(--card);
  border-radius:8px; padding:.75rem 1rem; margin:0 0 1.5rem; }
.alert p { margin:.2rem 0 .6rem; }
.alert.ok { border-left-color:#2e7d32; }
.alert.error { border-left-color:#b3261e; }
.alert.error ul { margin:0; padding-left:1.2rem; }
.validation-summary-valid { display:none; }
@media (prefers-color-scheme: dark) { .field-error { color:#f2b8b5; } }

/* evidence */
.evidence-grid { list-style:none; padding:0; margin:1rem 0 2rem; display:grid; gap:1.1rem;
  grid-template-columns:repeat(auto-fill,minmax(15rem,1fr)); }
.evidence-grid > li { background:var(--card); border:1px solid var(--rule); border-radius:10px;
  padding:.75rem; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:.5rem; }
.evidence { margin:0; }
.evidence img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:6px; }
.evidence figcaption { font-size:.9rem; margin-top:.5rem; display:flex; flex-direction:column; gap:.3rem; }
.evidence .kind { font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:var(--accent2); font-weight:700; }
.evidence blockquote { margin:0; font-style:italic; }
.evidence cite { display:block; font-style:normal; color:var(--muted); font-size:.85rem; margin-top:.2rem; }
.status { align-self:flex-start; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em;
  font-weight:700; border-radius:999px; padding:.1rem .6rem; border:1px solid var(--rule); color:var(--muted); }
.status-approved { color:#2e7d32; border-color:#2e7d32; }
.status-rejected { color:#b3261e; border-color:#b3261e; }
form.inline { display:flex; gap:.5rem; }
.district { font-size:.6em; font-weight:600; letter-spacing:.02em; }
.bio { white-space:pre-line; }
.small { font-size:.85rem; }

.table { border-collapse:collapse; width:100%; font-size:.92rem; margin:1rem 0; }
.table th,.table td { border-bottom:1px solid var(--rule); padding:.5rem .6rem; text-align:left; }
.table form { margin:0; }

/* listings */
.actions { display:flex; gap:.75rem; flex-wrap:wrap; }
.listing-grid { list-style:none; padding:0; margin:1rem 0 2rem; display:grid; gap:1.1rem;
  grid-template-columns:repeat(auto-fill,minmax(19rem,1fr)); }
.listing-grid > li { background:var(--card); border:1px solid var(--rule); border-radius:10px;
  padding:1rem 1.1rem; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:.5rem; }
.listing h3 { font-size:1.08rem; margin:.1rem 0 .35rem; line-height:1.3; }
.listing h3 a { color:var(--fg); text-decoration:none; }
.listing h3 a:hover { color:var(--accent2); }
.listing p { margin:0; }
.listing-desc { font-size:.92rem; color:var(--muted); display:-webkit-box; -webkit-line-clamp:3;
  -webkit-box-orient:vertical; overflow:hidden; white-space:pre-line; }
.listing-meta { font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin:0; }
.type { font-weight:700; }
.type-offer { color:var(--accent2); }
.type-want { color:#2f6f9f; }
@media (prefers-color-scheme: dark) { .type-want { color:#8cc4ee; } }
.qual { color:var(--accent2); }
.status-paused { color:var(--muted); border-style:dashed; }
.inline { display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; }
.inline form { margin:0; }

/* admin categories */
.catrow { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin:0; }
.catrow input:not([type=checkbox]) { font:inherit; font-size:.88rem; padding:.3rem .5rem; border:1px solid var(--rule);
  border-radius:6px; background:var(--card); color:var(--fg); min-width:0; }
.catrow input.num { width:5rem; }
.catrow .regulated { display:flex; gap:.4rem; flex-wrap:wrap; align-items:center; }
.catrow label.check { display:flex; gap:.3rem; align-items:center; font-size:.85rem; }
.form input:not([type=checkbox]):not([type=radio]), .form textarea, .form select { font-weight:400; }
.evidence-grid { align-items:start; }

/* browse & matches */
.search { display:flex; flex-wrap:wrap; gap:.75rem 1rem; align-items:flex-end; margin:0 0 1.5rem;
  padding:1rem; background:var(--card); border:1px solid var(--rule); border-radius:10px; }
.search label { display:flex; flex-direction:column; font-weight:600; font-size:.85rem; gap:.25rem; }
.search label.grow { flex:1 1 14rem; }
.search input, .search select { font:inherit; font-size:.95rem; font-weight:400; color:var(--fg); background:var(--bg);
  border:1px solid var(--rule); border-radius:8px; padding:.5rem .6rem; }
.search input:focus, .search select:focus { outline:2px solid var(--accent); outline-offset:1px; }
.listing-who { margin-top:.4rem !important; }
.listing-who a { font-weight:600; }
.pager { display:flex; gap:.5rem; flex-wrap:wrap; margin:1rem 0 2rem; }
.pager a, .pager span { padding:.3rem .7rem; border:1px solid var(--rule); border-radius:6px; text-decoration:none; }
.pager span { background:var(--accent); color:#fff; border-color:var(--accent); }
.match-list { list-style:none; padding:0; margin:.5rem 0 2rem; display:grid; gap:1rem;
  grid-template-columns:repeat(auto-fill,minmax(19rem,1fr)); }
.match-list .card h3 { margin-bottom:.6rem; }
.match-list .card p { margin:.25rem 0; }
.hero-actions { margin-top:1.5rem; }
@media (max-width:44rem) { .search { padding:.75rem; } .search label { flex:1 1 100%; } }

/* swaps */
.form.wide { max-width:40rem; }
.terms { display:grid; grid-template-columns:repeat(auto-fit,minmax(16rem,1fr)); gap:1rem; margin:0 0 1.5rem; }
.terms .card p { margin:.2rem 0; }
.swap-actions { display:flex; flex-wrap:wrap; gap:.75rem; align-items:flex-start; margin:0 0 2rem; }
.swap-actions form { margin:0; }
.inline-details > summary { list-style:none; cursor:pointer; }
.inline-details > summary::-webkit-details-marker { display:none; }
.inline-details[open] { flex-basis:100%; }
.inline-details[open] > summary { margin-bottom:.5rem; }
.history { list-style:none; padding:0; margin:0 0 2rem; }
.history li { padding:.6rem 0; border-bottom:1px solid var(--rule); }
.note-text { margin:.4rem 0 0; padding:.4rem .8rem; border-left:3px solid var(--rule); white-space:pre-line; font-size:.95rem; }
.swap-list { list-style:none; padding:0; margin:.5rem 0 2rem; display:grid; gap:1rem;
  grid-template-columns:repeat(auto-fill,minmax(19rem,1fr)); }
.swap-list .card p { margin:.2rem 0; }
.count-badge { display:inline-block; min-width:1.3em; padding:0 .35em; border-radius:999px; background:var(--accent);
  color:#fff; font-size:.75rem; text-align:center; line-height:1.4; margin-left:.2em; }

/* messages */
.thread-list { list-style:none; padding:0; margin:0 0 2rem; border-top:1px solid var(--rule); }
.thread-list li a { display:grid; grid-template-columns:auto 1fr auto; gap:.15rem .6rem; align-items:baseline;
  padding:.8rem .25rem; border-bottom:1px solid var(--rule); color:var(--fg); text-decoration:none; }
.thread-list li a:hover { background:var(--card); }
.thread-list .preview { grid-column:1 / -1; color:var(--muted); font-size:.92rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.thread-list .when { grid-row:1; grid-column:3; }
.thread-list li.unread .preview { color:var(--fg); font-weight:600; }
.thread { list-style:none; padding:0; margin:1.5rem 0; display:flex; flex-direction:column; gap:.6rem; max-width:44rem; }
.msg { max-width:85%; padding:.55rem .85rem; border-radius:12px; border:1px solid var(--rule); background:var(--card); }
.msg.mine { align-self:flex-end; background:color-mix(in srgb, var(--accent) 12%, var(--card)); border-color:color-mix(in srgb, var(--accent) 30%, var(--rule)); }
.msg .body { margin:0; white-space:pre-line; overflow-wrap:anywhere; }
.msg .meta { margin:.2rem 0 0; font-size:.75rem; color:var(--muted); }

/* trust */
.report-link { font-size:.78rem; color:var(--muted); }
.member-tools { margin-top:3rem; }
.inline-link { display:inline; margin:0; }
.linklike { background:none; border:0; padding:0; font:inherit; color:var(--muted); text-decoration:underline; cursor:pointer; }
.linklike:hover { color:var(--accent); }
.rating { font-size:1rem; }
.reviews { list-style:none; padding:0; margin:0 0 2rem; }
.reviews li { padding:.8rem 0; border-bottom:1px solid var(--rule); }
.reviews li p { margin:.2rem 0; }
.verdict { font-weight:700; font-size:.85rem; text-transform:uppercase; letter-spacing:.05em; }
.verdict.yes { color:#2e7d32; } .verdict.no { color:#b3261e; }
@media (prefers-color-scheme: dark) { .verdict.yes { color:#81c784; } .verdict.no { color:#f2b8b5; } }
.report { margin:0 0 1.25rem; }
.report p { margin:.25rem 0; }
.report-actions { max-width:none; margin:1rem 0 0; }
.report-img { max-width:240px; }
.button.danger { background:#b3261e; border-color:#b3261e; }
.button.danger:hover { background:#8c1d18; border-color:#8c1d18; }
.footer-links a { color:var(--muted); }
.prose .lead { font-size:1.12rem; }
.form label.check a { font-weight:600; }
