@import url("/tabs.css");
/* Shared look of the member pages (auctions, one auction, one lot). Same tokens as the account page. Phone first. */
:root{--paper:#F7F5F0;--paper-2:#EFEBE2;--ink:#151515;--ink-soft:#4A4640;--line:#D9D3C6;--accent:#F2C230;--board:#131211;--on-board:#F7F5F0;--on-board-soft:#A9A398;--good:#1F8A4C;--bad:#C8352B;--r:6px}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.5 "Barlow","Segoe UI",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
/* Ink ring on the light paper (yellow on cream was 1.5 to 1); yellow only on the dark boxes (CSS audit, Oct 11). */
:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
footer :focus-visible,.cash :focus-visible,.hero :focus-visible{outline-color:var(--accent)}
.wrap{max-width:760px;margin-inline:auto;padding-inline:16px}
header{border-bottom:1.5px solid var(--ink);background:var(--paper)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font:400 18px/1 "Saira Stencil One","Barlow Condensed",Impact,sans-serif;text-transform:uppercase}
.logo svg{width:32px;height:32px;flex:none}
.logo span{color:var(--ink-soft)}
.logo b{font-weight:400}
header nav{display:flex;gap:16px;font:600 15px/1 "Barlow",sans-serif}
@media (max-width:420px){.logo b{display:none}}
main{padding-block:24px 96px}
h1,h2,h3{font-family:"Barlow Condensed","Arial Narrow",Impact,sans-serif;text-transform:uppercase;line-height:1.02;margin:0;text-wrap:balance}
h1{font-size:clamp(30px,7vw,46px);font-weight:800}
h2{font-size:24px;font-weight:700;margin-top:32px;padding-top:16px;border-top:1.5px solid var(--line)}
h3{font-size:19px;font-weight:700}
p{margin:10px 0 0}
.crumb{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px 0 10px;margin-bottom:12px;border:1.5px solid var(--ink);border-radius:999px;background:#FFFEFA;color:var(--ink);text-decoration:none;font:700 15px/1 "Barlow Condensed","Arial Narrow",Impact,sans-serif;text-transform:uppercase;letter-spacing:.03em;box-shadow:2px 2px 0 var(--ink);-webkit-tap-highlight-color:transparent}
.crumb::before{content:"\2190";font-size:18px}
/* The way back stays on screen (Joel, Oct 12: "the back to other auctions or the back to auction should be sticky at the top so you can get back without having to scroll all the way to the top"). Lot and auction pages. A long auction name is cut with dots. */
.crumb.stick{position:sticky;top:max(8px,env(safe-area-inset-top,0px));z-index:25;max-width:100%}
.crumb.stick span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.meta{font:600 12.5px/1.4 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);margin-top:8px}
.fine{font-size:14.5px;color:var(--ink-soft)}
.status{margin-top:14px;font-weight:600;min-height:1.4em}
.status.bad{color:var(--bad)}
.status.good{color:var(--good)}
[hidden]{display:none!important}
.card{background:#FFFEFA;border:1.5px solid var(--ink);border-radius:var(--r);padding:16px 14px;margin-top:16px;box-shadow:4px 4px 0 var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 16px;border-radius:var(--r);border:2px solid var(--ink);background:var(--ink);color:var(--paper);font:700 18px/1 "Barlow Condensed","Arial Narrow",Impact,sans-serif;text-transform:uppercase;letter-spacing:.03em;cursor:pointer;text-decoration:none}
.btn.accent{background:var(--accent);color:var(--ink)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.small{min-height:44px;padding:6px 12px;font-size:15px}
.btn[disabled]{opacity:.55;cursor:default}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer;position:relative}
/* A 44px tap area around a text button without changing how it looks */
.linkbtn::after{content:"";position:absolute;inset:min(0px,(100% - 44px) / 2)}
input[type=text],input[type=number],input[type=search],select{font:500 17px/1.2 "Barlow","Segoe UI",system-ui,sans-serif;border:1.5px solid var(--ink);border-radius:var(--r);background:#fff;color:var(--ink);padding:10px;min-height:44px;max-width:100%}
.badge{display:inline-block;font:600 12px/1 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;text-transform:uppercase;padding:5px 7px;border-radius:4px;border:1.5px solid var(--ink);background:var(--paper-2);white-space:nowrap}
.badge.good{background:#DDF0E4;border-color:var(--good);color:#12562F}
.badge.warn{background:#FBEFC4;border-color:#9A7400;color:#5C4500}
.badge.bad{background:#F6DAD7;border-color:var(--bad);color:#7E1F18}
.badge.strong{background:var(--good);border-color:var(--good);color:#fff}
.badge.call{font-size:13px;padding:6px 9px}
.rated{margin-top:12px;padding:12px 14px;border:1.5px solid var(--ink);border-radius:var(--r);background:#FFFEFA}
.rated ul{margin:8px 0 0;padding-left:18px;font-size:15px;color:var(--ink-soft)}
.rated.none{border-style:dashed;border-color:var(--line)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.chip{font:600 15px/1 "Barlow",sans-serif;padding:9px 14px;border-radius:999px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;min-height:44px;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.chip[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.tools{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.tools>*{flex:1 1 150px}
.mono{font-family:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}
.pos{color:var(--good)}
.neg{color:var(--bad)}
footer{background:var(--board);color:var(--on-board-soft);font-size:14px;padding-block:24px 36px}
footer .wrap{display:flex;flex-direction:column;gap:10px}
footer nav{display:flex;flex-wrap:wrap;gap:8px 18px}
footer a,footer .linkbtn{color:var(--on-board)}

/* Lists of auctions and lots */
.list{list-style:none;margin:14px 0 0;padding:0}
.row{display:flex;gap:12px;padding:12px 0;border-bottom:1px dashed var(--line);text-decoration:none;align-items:flex-start}
.row .thumb{width:72px;height:72px;flex:none;border:1.5px solid var(--line);border-radius:var(--r);object-fit:cover;background:var(--paper-2)}
.row .body{flex:1;min-width:0}
.row .t{font-weight:600;line-height:1.25;overflow-wrap:anywhere}
.row .facts{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:6px;font:500 14.5px/1.35 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}
.row .facts b{font-weight:600}
.row .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;align-items:center}
@media (hover:hover) and (pointer:fine){a.row:hover .t{text-decoration:underline}}

/* One lot */
.lothead{display:flex;gap:14px;align-items:flex-start}
.lothead img{width:112px;height:112px;flex:none;border:1.5px solid var(--ink);border-radius:var(--r);object-fit:cover;background:var(--paper-2)}
.read{display:flex;flex-wrap:wrap;gap:6px 8px;margin-top:10px}
.read span{font:500 14px/1.2 "Barlow",sans-serif;background:var(--paper-2);border:1px solid var(--line);border-radius:4px;padding:5px 8px}
.read span b{font-weight:600}
.bidrow{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.bidrow label{flex:1 1 130px;font-weight:600;font-size:15px}
.bidrow input{display:block;width:100%;margin-top:4px;font:600 22px/1.1 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}
.eq{font:500 15px/1.4 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;margin-top:14px}
.eq h3{margin-bottom:2px}
.eq div{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px dashed var(--line)}
.eq div span:first-child{color:var(--ink-soft)}
.eq div.sum{border-bottom:0;border-top:1.5px solid var(--ink);font-weight:600}
.eq div.sum span:first-child{color:var(--ink)}
.eq small{color:var(--ink-soft);font-size:12.5px}
.cols{display:grid;grid-template-columns:1fr;gap:4px 24px}
@media (min-width:620px){.cols{grid-template-columns:1fr 1fr}}
.cash{margin-top:14px;padding:14px;border-radius:var(--r);background:var(--board);color:var(--on-board)}
.cash .big{font:700 38px/1 "Barlow Condensed","Arial Narrow",Impact,sans-serif}
.cash .big.pos{color:#7BE0A2}
.cash .big.neg{color:#FF9A8F}
.cash .lbl{font:600 12.5px/1.3 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--on-board-soft)}
.cash .side{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:10px;font:500 15px/1.3 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}
.cash .side b{color:var(--accent);font-weight:600}
details.costs{margin-top:14px;border-top:1.5px solid var(--line);padding-top:10px}
details.costs summary{font-weight:600;cursor:pointer;min-height:44px}
.form{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;margin-top:10px}
.form label{font-weight:600;font-size:14.5px}
.form label input[type=number]{display:block;width:100%;margin-top:4px}
.form label.check{grid-column:1/-1;display:flex;gap:10px;align-items:center;font-weight:500;font-size:16px}
.form label.check input{width:22px;height:22px}
.spans{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}
.spans div{border:1.5px solid var(--line);border-radius:var(--r);padding:10px 8px;background:var(--paper-2);text-align:center}
.spans div b{display:block;font:700 22px/1.1 "Barlow Condensed","Arial Narrow",sans-serif}
.spans div span{display:block;font:600 11.5px/1.3 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;text-transform:uppercase;color:var(--ink-soft)}
.bars{display:flex;align-items:flex-end;gap:4px;height:120px;margin-top:14px;padding-top:18px;overflow-x:auto}
.bars .bar{flex:1 0 26px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.bars .bar i{display:block;width:100%;background:var(--ink);border-radius:3px 3px 0 0;min-height:3px}
.bars .bar em{font:600 10.5px/1.2 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;font-style:normal;color:var(--ink-soft)}
.comp{display:flex;gap:10px;padding:12px 0;border-bottom:1px dashed var(--line)}
.comp img{width:64px;height:64px;flex:none;border:1.5px solid var(--line);border-radius:var(--r);object-fit:cover;background:var(--paper-2)}
.comp .body{flex:1;min-width:0}
.comp .t{font-weight:500;line-height:1.25;overflow-wrap:anywhere;font-size:15.5px}
.comp .p{font:600 18px/1.2 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;margin-top:4px}
.comp .p small{font-weight:500;font-size:13px;color:var(--ink-soft)}
.comp .why{font-size:14px;color:var(--ink-soft);margin-top:4px}
.comp .acts{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:8px;align-items:center;font-size:15px}
/* The Use this sale pill, one style for /lot and /lookup (docs/MOBILE-STANDARDS.md: 44 px, a button that says its state). */
.use{min-height:44px;padding:0 14px;border:1.5px solid var(--ink);border-radius:999px;background:#fff;font:600 15px/1 "Barlow",sans-serif;color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;gap:8px;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.use[aria-pressed=true]{background:var(--ink);color:#fff}
.use[aria-pressed=true]::before{content:"\2713"}
.comp .acts .linkbtn{min-height:44px;padding:0 6px}
.comp .acts select{font-size:16px;min-height:44px}
.comp.picked{background:#FFF8DC;margin-inline:-8px;padding-inline:8px;border-radius:var(--r)}
.comp.mine-down .t{text-decoration:line-through;color:var(--ink-soft)}
.pickbar{position:fixed;left:0;right:0;bottom:0;background:var(--accent);border-top:2px solid var(--ink);padding:10px 16px calc(10px + env(safe-area-inset-bottom));z-index:5}
.pickbar .wrap{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:0}
.pickbar b{font:700 20px/1.1 "Barlow Condensed","Arial Narrow",sans-serif;text-transform:uppercase}
.switches{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin-top:4px}
.switches .chips{margin-top:8px}
.switches label.check{display:flex;gap:10px;align-items:center;font-weight:500;font-size:16px;margin-top:10px;min-height:44px;-webkit-tap-highlight-color:transparent}
.switches label.check input{width:24px;height:24px;accent-color:var(--ink);flex:none}
.chips[hidden]{display:none}
/* Pricing data page */
a.chip{text-decoration:none;display:inline-flex;align-items:center}
.stat .sl{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;font-weight:600;font-size:16px;line-height:1.3}
.stat .sv{font:800 clamp(44px,13vw,64px)/1 "Barlow Condensed","Arial Narrow",Impact,sans-serif;margin-top:8px;font-variant-numeric:tabular-nums}
.stat .meta{margin-top:6px}
details.more{margin-top:12px;border-top:1.5px solid var(--line);padding-top:8px}
details.more summary{font-weight:600;font-size:15px;cursor:pointer;min-height:44px}
details.more h3{margin-top:16px}
.cats{margin-top:10px}
.cat{padding:9px 0;border-bottom:1px dashed var(--line)}
.cat:last-child{border-bottom:0}
.cat .cn{display:flex;justify-content:space-between;gap:12px;font-size:15.5px;font-weight:500}
.cat .cn b{font:600 15.5px/1.4 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;white-space:nowrap}
.cat .bar{height:6px;background:var(--paper-2);border-radius:3px;margin:5px 0 3px;overflow:hidden}
.cat .bar i{display:block;height:100%;background:var(--ink);border-radius:3px}
.cat .fine{font-size:13.5px}
.tag-early{font:600 11px/1 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;text-transform:uppercase;letter-spacing:.04em;color:#5C4500;background:#FBEFC4;border-radius:3px;padding:2px 5px}
.hist{list-style:none;margin:8px 0 0;padding:0;font:500 14.5px/1.4 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}
.hist li{display:flex;gap:12px;justify-content:space-between;padding:4px 0;border-bottom:1px dashed var(--line)}
.hist li span:last-child{color:var(--ink-soft)}
.hero{margin-top:16px;padding:20px 16px;border-radius:var(--r);background:var(--board);color:var(--on-board);box-shadow:4px 4px 0 var(--accent)}
.hero .hl{font:600 12.5px/1.3 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--on-board-soft)}
.hero .hv{font:800 clamp(56px,18vw,96px)/1 "Barlow Condensed","Arial Narrow",Impact,sans-serif;color:#7BE0A2;margin-top:8px;font-variant-numeric:tabular-nums}
.hero .hs{font-size:14.5px;color:var(--on-board-soft);margin-top:8px}
.hero .hf{margin-top:14px;border-top:1px solid #3A3733}
.hero .hf div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #3A3733;font-size:15.5px}
.hero .hf div:last-child{border-bottom:0}
.hero .hf span{color:var(--on-board-soft)}
.hero .hf b{font:600 15.5px/1.4 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;color:var(--accent);text-align:right}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.tile{background:#FFFEFA;border:1.5px solid var(--ink);border-radius:var(--r);padding:12px 10px;display:flex;flex-direction:column;gap:4px;min-width:0}
.tile b{font:800 clamp(24px,7.4vw,34px)/1 "Barlow Condensed","Arial Narrow",Impact,sans-serif;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.tile span{font-size:14px;line-height:1.25;color:var(--ink-soft)}
.fb-btn{position:fixed;right:12px;bottom:12px;z-index:40;font:700 14px/1 "Barlow Condensed","Arial Narrow",Impact,sans-serif;letter-spacing:.04em;text-transform:uppercase;padding:10px 12px;border:1.5px solid var(--ink);border-radius:var(--r);background:#F2C230;color:var(--ink);cursor:pointer;box-shadow:3px 3px 0 var(--ink)}
.fb-panel{position:fixed;top:auto;left:auto;right:12px;bottom:60px;z-index:41;width:min(360px,calc(100vw - 24px));margin:0} /* a popover: tap outside or Esc closes it */
.fb-panel select,.fb-panel textarea{display:block;width:100%;margin-top:8px;font:inherit;padding:8px;border:1.5px solid var(--ink);border-radius:var(--r);background:#fff}
.chg{display:block;font:600 12px/1.35 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;color:var(--ink-soft);margin-top:2px}
.chg.up{color:var(--good)}
.chg.down{color:var(--bad)}
.tile small{font:600 11.5px/1.3 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;color:var(--good)}
@media (min-width:620px){.tiles{grid-template-columns:1fr 1fr 1fr}}
/* Owner pages */
.card .sl{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;font-weight:600;font-size:17px;line-height:1.3}
.card .sl b{font:600 17px/1.3 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;white-space:nowrap}
/* The owner bar (docs/OWNER-HQ-PLAN.md): one row of links on every owner page; scrolls sideways on a narrow phone. */
.ownerbar{display:flex;gap:6px;overflow-x:auto;margin:0 -2px 14px;padding:2px;scrollbar-width:none}
.ownerbar::-webkit-scrollbar{display:none}
.ownerbar a{flex:0 0 auto;display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1.5px solid var(--ink);border-radius:999px;background:#FFFEFA;color:var(--ink);text-decoration:none;font:700 15px/1 "Barlow Condensed","Arial Narrow",Impact,sans-serif;text-transform:uppercase;letter-spacing:.03em}
.ownerbar a[aria-current="page"]{background:var(--ink);color:#FFFEFA}
/* The flip value, opened up (site/flip.js, Oct 13): one line with the number and how sure it is; a tap opens the math. */
details.flip{margin-top:14px;border:1.5px solid var(--ink);border-radius:var(--r);background:#FFFEFA}
details.flip summary{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;min-height:52px;padding:10px 14px;cursor:pointer;list-style:none}
details.flip summary::-webkit-details-marker{display:none}
details.flip summary .lbl{color:var(--ink-soft);font-size:15px}
details.flip summary .v{font:700 30px/1 "Barlow Condensed","Arial Narrow",Impact,sans-serif}
details.flip summary .how{margin-left:auto;font-weight:600;font-size:14px;text-decoration:underline;text-underline-offset:3px}
details.flip summary .how::after{content:" \25BE"}
details.flip[open] summary .how::after{content:" \25B4"}
details.flip .flipbody{padding:0 14px 14px;border-top:1px dashed var(--line)}
details.flip .flipbody p{margin-top:10px;font-size:15px}
details.flip .trust b{font-weight:700}
.ladder{list-style:none;margin:12px 0 0;padding:0;font-size:15px;line-height:1.35}
.ladder li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px dashed var(--line)}
.ladder li span{color:var(--ink-soft)}
.ladder li b{white-space:nowrap;font:600 15px/1.35 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}
.ladder li.sum{border-bottom:0;border-top:1.5px solid var(--ink);font-weight:600}
.ladder li.sum span{color:var(--ink)}
.ladder li.max{background:var(--accent);margin:4px -8px 0;padding:8px;border-radius:4px;border-top:0}
/* Lot page, Right now (Oct 17): the bid as of our last read, the next bid, who holds it, a countdown, the Bid button */
.nowbox{margin-top:14px;border:2px solid var(--ink);border-radius:var(--r);background:var(--paper-2);padding:12px 14px}
.nowbox .k0{font:600 12.5px/1.3 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:8px}
.nowbox .nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.nowbox .n .k{font:600 12.5px/1.3 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;text-transform:uppercase;color:var(--ink-soft)}
.nowbox .n .v{font:800 28px/1.1 "Barlow Condensed","Arial Narrow",Impact,sans-serif;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.nowbox .n .v.soon{color:var(--bad)}
.nowbox .who{margin-top:10px;font:700 16px/1.35 "Barlow",sans-serif}
.nowbox .who.good{color:#12562F}
.nowbox .who.bad{color:#7E1F18}
.nowbox .age{margin-top:6px;font-size:15px;line-height:1.4;color:var(--ink-soft)}
.nowbox .btn{margin-top:12px;width:100%}
.nowbox .who a{position:relative}
.nowbox .who a::after{content:"";position:absolute;inset:min(0px,(100% - 44px) / 2)}