/* Mudwater Tracker (unofficial). Black & gold look inspired by the collection; open-licensed Google Fonts only. */
:root{
  --font:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --font-label:"Oswald","Manrope",-apple-system,"Segoe UI",sans-serif;
  --font-title:"Bebas Neue","Oswald",Impact,sans-serif;
  --panel:#070603; --selected:#272307;
  --line:#b8ad6273; --line-subtle:#6c653942; --line-strong:#e1d68b;
  --txt:#dcd2b7; --txt-hi:#f0e9c1; --mut:#b8b18d; --ink:#f1e0a9;
  --acc:#c4a34f; --frame:#5f561d; --track:#1d1a08;
  --g:#d4ec8c; --r:#ffa396; --a:#e5c36c; --shine:#fff3bd1c;
  --gold-grad:linear-gradient(180deg,#6e6001,#aea35c 51%,#383000);
  --tile-grad:linear-gradient(180deg,#000 50%,#131000);
  --c-common:#c4c8d1; --c-uncommon:#4ade80; --c-rare:#5fd6e8; --c-prestige:#c9a2ff; --c-legendary:#ffd36b;
}
*{box-sizing:border-box}html,body{margin:0;padding:0}
body{background:#000;color:var(--txt);font-family:var(--font);font-size:15px;line-height:1.4;-webkit-font-smoothing:antialiased;padding-bottom:calc(96px + env(safe-area-inset-bottom))}
::selection{background:#c4a34f;color:#0e0c09}
a{color:var(--acc);text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
code{background:#111006;border:1px solid var(--line-subtle);border-radius:5px;padding:0 4px;font-size:.92em;word-break:break-all}
.wrap{max-width:1100px;margin:0 auto;padding:12px 16px 0}
.loading{padding:40px 0;text-align:center;color:var(--mut)}
.lab{font-family:var(--font-label);text-transform:uppercase;letter-spacing:.07em}
.mut{color:var(--mut)}.pos{color:var(--g)}.neg{color:var(--r)}.tiny{font-size:12px}
.brand{display:flex;align-items:center;gap:10px;padding:6px 0 2px}
.brand .logo{white-space:nowrap;font-family:var(--font-title);font-size:24px;letter-spacing:.04em;color:var(--txt-hi);line-height:1}
.brand .logo b{color:var(--acc);font-weight:400}
.brand .uo{font-family:var(--font-label);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);border:1px solid var(--frame);border-radius:4px;padding:0 5px}
.brand .who{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--mut);min-width:0}
.brand .who code{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;vertical-align:bottom}
.top{display:flex;align-items:center;gap:18px;padding-top:8px}
.tabs{display:flex;gap:18px}
.tab{font-family:var(--font-title);font-size:30px;color:#6f6a52;padding-bottom:4px;border-bottom:3px solid transparent;line-height:1}
.tab.on{color:var(--txt-hi);border-color:var(--acc)}
.usd{margin-left:auto;display:flex;align-items:center;gap:6px;font-weight:700;color:var(--txt-hi)}
.usd i{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--acc);color:#000;font-style:normal;font-size:13px;font-weight:800}
.pm{margin-top:18px;font-weight:700;font-size:18px;color:var(--txt-hi)}.pm b{color:var(--acc)}
.big{display:flex;align-items:center;gap:12px;margin-top:2px}
.big .v{font-weight:800;font-size:44px;letter-spacing:-.02em;color:#fff;line-height:1.1}
.eye{width:32px;height:32px;border-radius:50%;background:#1c1a10;display:grid;place-items:center;color:var(--mut)}
.chg{font-weight:600;font-size:16px;margin-top:2px}
.sub{font-size:12.5px;color:var(--mut);margin-top:2px}
.chart{position:relative;margin:10px -16px 0;height:220px}
.chart svg{width:100%;height:100%;display:block}
.chart .note{position:absolute;left:16px;right:16px;bottom:10px;text-align:center}
.chips{display:flex;justify-content:center;gap:6px;margin:10px 0 4px;flex-wrap:wrap}
.rc{font-family:var(--font-label);font-weight:600;font-size:17px;color:#8b8566;min-width:48px;height:44px;border-radius:22px}
.rc.on{background:var(--txt-hi);color:#000}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin:14px 0;box-shadow:inset 0 1px var(--shine)}
.card h3{margin:0 0 8px;font-size:17px;font-weight:700;color:var(--txt-hi);display:flex;align-items:center;gap:8px}
.card h3 a,.card h3 .r{margin-left:auto;font-size:13px;font-weight:600}
.va{display:block;text-align:center;font-weight:700;margin-top:8px}
h1.pg{font-family:var(--font-title);font-weight:400;font-size:34px;margin:10px 0 0;color:var(--txt-hi);line-height:1.05}
h2.sec{font-size:20px;font-weight:700;color:var(--txt-hi);margin:22px 0 10px}
.row{display:flex;align-items:center;gap:12px;padding:9px 0;border-top:1px solid var(--line-subtle);color:inherit}
.row:first-of-type{border-top:0}
.row .th{width:44px;height:61px;border-radius:5px;object-fit:cover;background:#111006;flex:none}
.row .nm{flex:1;min-width:0}.row .nm b{display:block;color:var(--txt-hi);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .rt{text-align:right;white-space:nowrap}.row .rt b{display:block;color:#fff}
.car{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px;padding:0 16px 6px;scrollbar-width:none}
.car::-webkit-scrollbar{display:none}
.sp{flex:none;width:78%;max-width:300px;scroll-snap-align:start;border-radius:12px;padding:14px;background:var(--tile-grad);border:1px solid var(--line);color:inherit}
.sp .rn{font-family:var(--font-title);font-size:30px;line-height:1}
.sp .ct{font-size:28px;font-weight:800;color:#fff;margin-top:6px}
.sp.mini{width:44%;max-width:170px;padding:8px}
.sp.mini img{width:100%;border-radius:6px;aspect-ratio:260/360;object-fit:cover;background:#111006;display:block}
.bar{height:8px;border-radius:4px;background:var(--track);border:1px solid var(--frame);overflow:hidden;margin:8px 0}
.bar>i{display:block;height:100%;background:var(--gold-grad)}
.r-Common{color:var(--c-common)}.r-Uncommon{color:var(--c-uncommon)}.r-Rare{color:var(--c-rare)}.r-Prestige{color:var(--c-prestige)}.r-Legendary{color:var(--c-legendary)}
.kp{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.k{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px}
.k .l{font-family:var(--font-label);text-transform:uppercase;letter-spacing:.07em;font-size:11.5px;color:var(--mut)}
.k .v{font-size:22px;font-weight:800;color:#fff;margin-top:2px}
.k .s{font-size:12px;color:var(--mut)}
.nav{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(12px + env(safe-area-inset-bottom));width:min(560px,calc(100% - 20px));display:flex;justify-content:space-around;background:#14120bf0;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--frame);border-radius:30px;padding:6px;z-index:50;box-shadow:0 10px 40px #000c}
.nav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--mut);font-size:12px;font-weight:600;padding:6px 0;border-radius:24px}
.nav a.on{background:#3a3418;color:var(--txt-hi)}
.nav svg{width:22px;height:22px}
.tools{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
input.in,select.in{background:#000;border:1px solid var(--frame);color:var(--txt-hi);border-radius:10px;min-height:44px;padding:0 12px;font:inherit;min-width:0}
input.in:focus{outline:2px solid var(--acc);outline-offset:1px}
.tools input.in{flex:1 1 100%}
.fc{font-family:var(--font-label);text-transform:uppercase;letter-spacing:.06em;font-size:12.5px;border:1px solid var(--frame);border-radius:18px;padding:0 12px;height:34px;color:var(--ink);background:#000}
.fc.on{background:var(--selected);border-color:var(--line-strong);color:var(--txt-hi)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px}
.tile{background:var(--tile-grad);border:1px solid var(--line-subtle);border-radius:9px;padding:6px;position:relative;display:block;color:inherit}
.tile .art{aspect-ratio:260/360;border-radius:6px;overflow:hidden;background:#111006}
.tile .art img{width:100%;height:100%;object-fit:cover;display:block}
.tile.miss .art img{filter:grayscale(1) brightness(.4)}.tile.miss .tn{opacity:.6}
.tile .tn{font-size:12px;font-weight:700;color:var(--txt-hi);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:5px}
.tile .tp{display:flex;justify-content:space-between;font-size:11.5px;color:var(--mut)}
.badge{position:absolute;top:10px;right:10px;background:var(--acc);color:#000;font-weight:800;font-size:11.5px;border-radius:10px;padding:1px 7px}
.wbadge{position:absolute;top:10px;left:10px;color:var(--a);font-size:14px;text-shadow:0 0 4px #000}
.det{display:grid;gap:16px}
.det .art{border-radius:14px;overflow:hidden;background:#111006;max-width:420px;margin:0 auto;width:100%;aspect-ratio:1621/2250;border:1px solid var(--line)}
.det .art img{width:100%;height:100%;object-fit:contain;display:block}
.dl{display:grid;grid-template-columns:1fr auto;gap:6px 12px;font-size:14px;margin:0}.dl dt{color:var(--mut)}.dl dd{margin:0;text-align:right;color:var(--txt-hi);font-weight:600}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line-strong);border-radius:10px;min-height:44px;padding:0 14px;color:var(--txt-hi);background:var(--selected);font-weight:700}
.btn.ghost{background:#000;border-color:var(--frame)}
.btn.sm{min-height:32px;padding:0 10px;font-size:13px}
.btns{display:flex;flex-wrap:wrap;gap:8px}
.back{color:var(--mut);font-weight:600;display:inline-block;margin:6px 0}
.note{font-size:12.5px;color:var(--mut)}
.warn{border:1px solid var(--a);color:var(--a);border-radius:10px;padding:10px 12px;font-size:13px;margin:10px 0}
.errbox{border:1px solid var(--r);color:var(--r);border-radius:10px;padding:10px 12px;font-size:13.5px;margin:10px 0}
.hero{padding:34px 0 10px;text-align:center}
.hero h1{font-family:var(--font-title);font-weight:400;font-size:clamp(46px,11vw,84px);line-height:.95;margin:0;color:var(--txt-hi);letter-spacing:.01em}
.hero h1 b{color:var(--acc);font-weight:400}
.hero p{max-width:560px;margin:12px auto 0;color:var(--mut)}
.af{display:flex;gap:8px;max-width:620px;margin:22px auto 6px;flex-wrap:wrap}
.af input{flex:1 1 280px;font-size:16px}
.af .btn{flex:1 0 auto}
.feat{display:grid;grid-template-columns:1fr;gap:10px;margin-top:22px}
.feat .k .v{font-size:17px}
.recent{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:10px}
.cost{display:flex;gap:8px;align-items:center;margin-top:8px}
.cost input{width:120px}
.hide{display:none!important}
footer{margin-top:28px;padding:14px 0;font-size:12px;color:var(--mut);border-top:1px solid var(--line-subtle)}
footer p{margin:4px 0}
@media(max-width:480px){.brand .logo{font-size:21px}.brand .who code{display:none}}
@media(min-width:900px){
 .grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
 .home2{display:grid;grid-template-columns:1.3fr 1fr;gap:20px;align-items:start}
 .chart{margin:10px 0 0;height:300px}
 .det{grid-template-columns:minmax(280px,420px) 1fr}
 .kp{grid-template-columns:repeat(4,1fr)}
 .tools input.in{flex:1 1 260px}
 .feat{grid-template-columns:repeat(3,1fr)}
 .brand .who code{max-width:260px}
}
/* social */
.brand .who .nk{color:var(--acc);font-weight:700;white-space:nowrap}
.socbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:4px 0}
.frn{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.frn .in{min-height:34px;width:160px}
.ff{display:flex;gap:8px;flex-wrap:wrap}.ff .in{flex:1 1 220px}.ff #fn{flex:1 1 140px}
.frs{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:760px){.frs{grid-template-columns:1fr 1fr}}
.fr{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px;box-shadow:inset 0 1px var(--shine);display:flex;flex-direction:column;gap:8px}
.frm{color:inherit;display:block}
.frh{display:flex;align-items:baseline;gap:8px;justify-content:space-between}.frh b{font-size:18px;color:var(--txt-hi)}
.frv{display:flex;gap:16px;margin-top:6px}.frv .v{font-size:20px;font-weight:800;color:#fff}
.rbars{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:4px}.rbars>div{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:700}.rbars .bar{flex:1;height:6px;margin:0}
.cmp2{display:grid;grid-template-columns:1fr;gap:12px;margin-top:8px}@media(min-width:760px){.cmp2{grid-template-columns:1fr 1fr}}
.lab{text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px}
textarea.in.ta{width:100%;margin-top:8px;padding:8px;font:12px/1.4 ui-monospace,monospace;background:#000;border:1px solid var(--frame);color:var(--txt-hi);border-radius:10px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
#meform{margin-left:0;margin-right:0;max-width:640px;justify-content:flex-start}

/* ---------- past sales (v0.4.0) */
/* past-sales panels (drop-in for site/style.css) */
.mwc{position:relative;margin:8px -4px 0;min-height:200px;touch-action:pan-y}
.mwc svg{display:block;width:100%;height:auto;font-family:var(--font-label,Oswald,sans-serif)}
.mwbk{position:absolute;right:6px;top:-2px}
.mwtip{position:absolute;display:none;pointer-events:none;background:#14120bf2;border:1px solid var(--line-strong,#e1d68b);border-radius:8px;padding:6px 9px;font-size:12px;line-height:1.35;color:var(--txt-hi,#f0e9c1);white-space:nowrap;z-index:5;box-shadow:0 8px 24px #000c}
.mwtip code{font-size:11px}
.mwtog{display:flex;gap:6px;flex-wrap:wrap;margin:2px 0 10px}
.mwk{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.mwk>div{background:#000;border:1px solid var(--line-subtle,#6c653942);border-radius:8px;padding:7px 9px;min-width:0}
.mwk b{display:block;color:var(--txt-hi,#f0e9c1);font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mwk .lab{display:block;font-size:10.5px}
@media (max-width:560px){.mwk{grid-template-columns:repeat(2,1fr)}}
.mwchips{margin:6px 0 2px}
.mwlg{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;margin:4px 0 8px}
.mwlg span{display:inline-flex;align-items:center;gap:5px}
.mwlg i{display:inline-block}
.mwlg .d{width:8px;height:8px;border-radius:50%}.mwlg .d.o{background:#f0e9c1}.mwlg .d.m{background:#5fd6e8}
.mwlg .ln{width:16px;height:3px;background:#e1c56d;border-radius:2px}.mwlg .ln.c{background:#5fd6e8}
.mwlg .bd{width:14px;height:10px;background:#c4a34f33;border-radius:2px}
.mwlg .bar{width:10px;height:12px;background:linear-gradient(#e1c56d,#6e6001);border-radius:2px}
.mwlg .bar.p{background:repeating-linear-gradient(45deg,#5f561d 0 3px,#c4a34f 3px 5px)}
.mwr{display:grid;grid-template-columns:1fr auto;gap:0 10px;padding:7px 0;border-top:1px solid var(--line-subtle,#6c653942);font-size:13px}
.mwr b{color:#fff;text-align:right}.mwr .tiny{grid-column:1}.mwr code{grid-column:2;grid-row:2;justify-self:end;align-self:center}
.mwt{width:100%;border-collapse:collapse;font-size:13px}
.mwt th,.mwt td{padding:7px 8px;text-align:right;border-bottom:1px solid var(--line-subtle,#6c653942);vertical-align:top}
.mwt th:first-child,.mwt td:first-child{text-align:left}
.mwt th{font-family:var(--font-label,Oswald,sans-serif);text-transform:uppercase;letter-spacing:.06em;font-weight:500;font-size:11.5px;color:var(--ink,#f1e0a9);background:var(--panel2,#111006)}
.mwtw,.tw.mw{overflow-x:auto;border:1px solid var(--line,#b8ad6273);border-radius:10px;background:var(--panel,#070603)}
footer .ver{margin-top:6px;font-family:var(--font-label);letter-spacing:.06em;font-size:11.5px}
ul.wn{margin:0;padding-left:18px}ul.wn li{margin:4px 0;font-size:14px}
.warn.stale{margin:6px 0 4px;font-weight:600}
/* v0.4.2 outlier marker: listing shown, excluded from totals */
.oval{text-decoration:line-through;text-decoration-thickness:1px;opacity:.7}
.omark{display:inline-block;font-size:11px;font-weight:600;color:var(--a);border:1px solid var(--a);border-radius:6px;padding:0 5px;margin-left:2px;white-space:nowrap;vertical-align:middle;text-decoration:none}
