.find-bar { padding: 1.25rem var(--tf-gutter); background: var(--tf-paper-deep); border-bottom: 1.5px solid var(--tf-ink); }
.find-bar .address-search { max-width: 72rem; margin: 0 auto; }

.results { padding: 2rem var(--tf-gutter) 0; max-width: 76rem; margin: 0 auto; }
.results-head { display: grid; gap: .7rem; padding-bottom: 1.5rem; border-bottom: 1.5px solid var(--tf-ink); }
.results-head h1 { font-size: var(--tf-step-3); }
.results-where { display: flex; gap: .4rem; color: var(--tf-slate); }
.results-list { list-style: none; margin: 0; padding: 1.5rem 0; display: grid; gap: 1.25rem; }

.results-action {
    position: sticky;
    bottom: 0;
    display: grid;
    gap: .6rem;
    margin: 0 calc(var(--tf-gutter) * -1);
    padding: .9rem var(--tf-gutter) calc(.9rem + env(safe-area-inset-bottom));
    background: var(--tf-ink);
    color: var(--tf-paper);
    font-size: var(--tf-step--1);
}

.shingle { display: grid; background: var(--tf-card); border: 1.5px solid var(--tf-ink); position: relative; }
.shingle::before { content: ""; position: absolute; inset: 5px; border: .75px solid var(--tf-line-strong); pointer-events: none; }
.shingle-board { display: grid; gap: .55rem; padding: 1.2rem 1.15rem 1rem; }
.shingle h3 { font-size: var(--tf-step-2); text-transform: uppercase; }
.shingle h3 a { text-decoration: none; }
.shingle-meta { display: flex; gap: .35rem; align-items: center; font-size: var(--tf-step--1); color: var(--tf-slate); }
.shingle-about { color: var(--tf-slate); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.shingle-badges { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.shingle-badges li { display: inline-flex; gap: .3rem; align-items: center; padding: .25rem .55rem; font-size: var(--tf-step--1); font-weight: 600; background: #e3ebe5; color: var(--tf-bottle); border-radius: var(--tf-radius); }
.shingle-foot { display: grid; gap: .8rem; padding: 1rem 1.15rem 1.15rem; border-top: 6px double var(--tf-ink); background: var(--tf-paper); }
.shingle-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem; }
.shingle-price strong { font: 800 var(--tf-step-2)/1 var(--tf-display); color: var(--tf-bottle); }
.shingle-price span { font-size: var(--tf-step--1); color: var(--tf-slate); }
.shingle-brand { display: inline-flex; gap: .3rem; align-items: center; font-size: var(--tf-step--1); font-weight: 600; }
.shingle-pick {
    display: flex;
    gap: .6rem;
    align-items: center;
    min-height: 3rem;
    padding: .5rem .8rem;
    border: 1.5px solid var(--tf-ink);
    border-radius: var(--tf-radius);
    background: var(--tf-card);
    font-weight: 700;
    cursor: pointer;
    position: relative;
}
.shingle-pick input { width: 1.2rem; height: 1.2rem; margin: 0; accent-color: var(--tf-brick); }
.shingle-pick:has(input:checked) { background: var(--tf-bottle); color: var(--tf-paper); border-color: var(--tf-bottle); }
.shingle-pick:has(input:disabled) { opacity: .45; cursor: not-allowed; }

.profile-sheet { display: grid; }
.profile-photo { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-bottom: 1.5px solid var(--tf-ink); }
.profile-board { display: grid; gap: 1.1rem; padding: 1.75rem var(--tf-gutter) 0; max-width: 46rem; }
.profile-board h1 { font-size: var(--tf-step-4); }
.profile-prices { margin: 0; display: grid; border-top: 1.5px solid var(--tf-ink); }
.profile-prices div { display: flex; justify-content: space-between; gap: 1rem; padding: .8rem 0; border-bottom: 1.5px dotted var(--tf-line-strong); }
.profile-prices dt { font-weight: 600; }
.profile-prices dd { margin: 0; font: 800 var(--tf-step-1)/1.2 var(--tf-display); color: var(--tf-bottle); }
.profile-brand a { display: inline-flex; gap: .35rem; align-items: center; font-weight: 700; }
.profile-ask { display: grid; gap: 1rem; padding: 1.25rem; background: var(--tf-paper-deep); border: 1.5px solid var(--tf-ink); }

.lost-sign { display: grid; gap: 1rem; justify-items: start; padding: 4rem var(--tf-gutter); max-width: 46rem; }

@media (min-width: 48rem) {
    .results-list { grid-template-columns: repeat(2, 1fr); }
    .results-action { grid-template-columns: 1fr auto; align-items: center; margin: 0; border-radius: var(--tf-radius); padding: 1rem 1.25rem; }
    .find-bar .address-search { grid-template-columns: 1.3fr 2fr auto; align-items: end; }
    .find-bar .trade-pick legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
}

@media (min-width: 72rem) {
    .results-list { grid-template-columns: repeat(3, 1fr); }
    .profile-sheet { grid-template-columns: 1fr 1fr; align-items: start; }
    .profile-photo { position: sticky; top: 4rem; height: calc(100dvh - 4rem); aspect-ratio: auto; border-bottom: 0; border-right: 1.5px solid var(--tf-ink); }
    .profile-board { padding-top: 3rem; }
}