/* Most Wanted: a bounty board. Parchment posters pinned to dark deck boards; ink, rope gold and a red seal for accents. */
.wboard{--parch:#f1e3c4;--parch2:#e6d3a8;--ink:#2a1c10;--ink2:#5b452d;--rope:#c9973f;--seal:#a3271f;--deck:#101a2b;--deck2:#16233a;
  display:grid;gap:16px;padding:18px;border-radius:16px;color:#f4ecd8;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 2px,transparent 2px 140px),linear-gradient(180deg,var(--deck2),var(--deck));
  border:1px solid rgba(201,151,63,.35)}
.wboard .note{color:#b9c2d6}
.whead{display:flex;gap:16px;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;border-bottom:2px dashed rgba(201,151,63,.45);padding-bottom:14px}
.wtitle{font:400 44px/1 "Pirata One","Inter",serif;letter-spacing:.02em;margin:0;color:var(--parch);text-shadow:0 2px 0 rgba(0,0,0,.4)}
.wsub{margin:6px 0 0;max-width:64ch;color:#d9d2bf;font-size:14px}
.wcount{display:flex;flex-direction:column;align-items:center;padding:8px 16px;border:2px solid var(--rope);border-radius:12px;background:rgba(201,151,63,.12)}
.wcount b{font:400 26px/1.1 "Pirata One","Inter",serif;color:var(--parch)}.wcount span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#d9c59a}
.wsec{font:400 24px/1.1 "Pirata One","Inter",serif;margin:0;color:var(--parch);letter-spacing:.02em}
.wsec i,.wchips i{font:600 11px/1 "Inter",sans-serif;font-style:normal;background:rgba(201,151,63,.2);color:#ecd9a8;border-radius:999px;padding:3px 7px;margin-left:6px;vertical-align:middle}
.wgame{margin-top:6px;padding-top:12px;border-top:1px solid rgba(201,151,63,.25)}
/* filter bar: stays in reach while scrolling a long board */
.wbar{position:sticky;top:calc(58px + env(safe-area-inset-top,0px));z-index:3;display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;padding:10px 12px;border-radius:12px;background:rgba(13,22,38,.94);border:1px solid rgba(201,151,63,.3);backdrop-filter:blur(8px)}
.wbar input[type=search]{flex:1 1 220px;min-width:0;background:#0b1322;border:1px solid rgba(201,151,63,.35);color:#f4ecd8;border-radius:10px;padding:8px 12px;font:inherit}
.wchips{display:flex;flex-wrap:wrap;gap:4px}
.wchips button{border:1px solid rgba(201,151,63,.3);background:transparent;color:#d9d2bf;border-radius:999px;padding:6px 11px;font:600 12.5px "Inter",sans-serif}
.wchips button[aria-pressed="true"]{background:var(--rope);border-color:var(--rope);color:#1a1206}
.wchips button[aria-pressed="true"] i{background:rgba(26,18,6,.2);color:#1a1206}
.wsel,.wchk{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:#d9d2bf}
.wsel select{background:#0b1322;border:1px solid rgba(201,151,63,.35);color:#f4ecd8;border-radius:10px;padding:6px 8px;font:inherit}
.wmeta{font-size:12.5px;color:#b9c2d6;margin-top:-6px}
/* posters */
.wgrid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,208px),1fr))}
.wposter{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px 14px 12px;color:var(--ink);text-align:center;min-width:0;
  background:radial-gradient(120% 90% at 50% 0%,var(--parch),var(--parch2));border-radius:4px;box-shadow:0 6px 14px rgba(0,0,0,.45),inset 0 0 0 1px rgba(90,60,20,.25),inset 0 0 26px rgba(120,80,30,.22)}
.wposter::before{content:"";position:absolute;top:-6px;left:50%;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#e9c67a,#8a5f1c);box-shadow:0 2px 3px rgba(0,0,0,.5)}
.wposter.gone{filter:grayscale(.55) brightness(.82)}
.wp-top{border-bottom:2px solid var(--ink);padding-bottom:4px}
.wp-word{font:400 30px/1 "Pirata One","Inter",serif;letter-spacing:.12em;text-transform:uppercase}
.wp-name{margin:4px 0 0;font:800 15px/1.25 "Inter",sans-serif;overflow-wrap:anywhere;text-wrap:balance}
.wp-set{font:500 11.5px/1.3 "Inter",sans-serif;color:var(--ink2)}
.wp-grade{align-self:center;display:inline-block;font:800 11px/1 "Inter",sans-serif;letter-spacing:.08em;text-transform:uppercase;padding:5px 8px;border-radius:3px;border:2px solid currentColor;transform:rotate(-2deg)}
.wp-grade.slab{color:var(--seal)}.wp-grade.raw{color:#1f5a3d}
.wp-bounty{margin-top:4px;padding:8px 4px 6px;border-top:1px dashed rgba(42,28,16,.5);border-bottom:1px dashed rgba(42,28,16,.5);display:flex;flex-direction:column;gap:1px}
.wp-bounty span{font:700 10px/1 "Inter",sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--ink2)}
.wp-bounty b{font:400 30px/1.05 "Pirata One","Inter",serif;font-variant-numeric:tabular-nums}
.wp-bounty small{font:500 11px/1.2 "Inter",sans-serif;color:var(--ink2)}
.wp-note{font:500 11.5px/1.3 "Inter",sans-serif;color:var(--ink2)}
.wp-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:6px;min-height:36px}
.wp-left{font:600 11.5px/1.2 "Inter",sans-serif;color:var(--ink2);text-align:left}
.wp-mine{font:800 11px/1 "Inter",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#1f5a3d}
.wp-claim{background:var(--ink);color:var(--parch);border:0;border-radius:999px;padding:8px 16px;font:800 12.5px "Inter",sans-serif;letter-spacing:.04em;cursor:pointer}
.wp-claim:hover{background:var(--seal);border:0}
.wp-claim:focus-visible,.wchips button:focus-visible,.wc-ghost:focus-visible{outline:2px solid var(--rope);outline-offset:2px}
/* your claims */
.wmine{display:grid;gap:10px}
.wclaims{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr))}
.wclaim{display:grid;gap:8px;padding:12px 14px;border-radius:12px;background:rgba(13,22,38,.7);border:1px solid rgba(201,151,63,.3)}
.wclaim.live{border-color:var(--rope);box-shadow:0 0 0 1px var(--rope) inset}
.wc-head{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}.wc-head b{font-size:15px;overflow-wrap:anywhere}
.wclaim .wp-grade{transform:none;background:var(--parch)}
.wc-time{font:400 28px/1 "Pirata One","Inter",serif;color:var(--parch);font-variant-numeric:tabular-nums}.wc-time.low{color:#ff8a7a}
.wc-drop{display:block;text-align:center;padding:14px;border:2px dashed rgba(201,151,63,.6);border-radius:10px;color:#f4ecd8;font-weight:600;cursor:pointer}
.wc-drop small{display:block;font-weight:500;font-size:12px;color:#b9c2d6;margin-top:3px}
.wc-drop.on,.wc-drop:hover{background:rgba(201,151,63,.14)}
.wc-msg{padding:8px 10px;border-radius:8px;font-size:13px;background:rgba(201,151,63,.14);color:#f4ecd8}.wc-msg.bad{background:rgba(254,93,75,.16);color:#ffb3a8}
.wc-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:space-between}.wc-row .note{flex:1 1 180px;font-size:12px}
.wc-ghost{background:transparent;border:1px solid rgba(201,151,63,.4);color:#e8dcc0;border-radius:999px;padding:6px 12px;font:600 12px "Inter",sans-serif}
.wc-line{font-size:13.5px}
.wc-chip{display:inline-block;font:700 10.5px/1 "Inter",sans-serif;letter-spacing:.05em;text-transform:uppercase;padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.1);color:#d9d2bf;margin-right:6px}
.wc-chip.ok{background:rgba(58,208,122,.18);color:#7fe3ac}.wc-chip.wait{background:rgba(201,151,63,.22);color:#ecd9a8}.wc-chip.bad{background:rgba(254,93,75,.18);color:#ffb3a8}
.wempty{padding:28px;text-align:center;color:#b9c2d6}
.wmore{display:flex;gap:12px;align-items:center;justify-content:center}
.wmore button{background:var(--rope);border:0;color:#1a1206;border-radius:999px;padding:9px 18px;font:800 13px "Inter",sans-serif}
/* the tab */
nav.psub .wtab{color:#e9c67a}nav.psub .wtab[aria-pressed="true"]{color:#fff}
@media (max-width:640px){.wboard{padding:12px}.wtitle{font-size:34px}.wbar{position:static}.wgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.wposter{padding:14px 9px 10px}.wp-word{font-size:24px}.wp-bounty b{font-size:24px}.wp-foot{flex-direction:column}}
@media (prefers-reduced-motion:reduce){.wposter,.wp-claim{transition:none}}

/* card photo: framed like a portrait on the poster; the photo keeps the card's own shape */
.wp-photo{align-self:center;width:min(100%,150px);aspect-ratio:5/7;padding:4px;background:#fff8e6;box-shadow:inset 0 0 0 1px rgba(42,28,16,.45),0 2px 4px rgba(0,0,0,.25);margin-top:4px}
.wp-photo img{display:block;width:100%;height:100%;object-fit:contain;background:#1b1b1b}
.wc-thumb{width:40px;height:56px;object-fit:contain;background:#1b1b1b;border-radius:3px;flex:none}
@media (max-width:640px){.wp-photo{width:min(100%,120px)}}

/* an approved claim: the special request number and what to do with the box */
.wc-sr{font:700 13px/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.04em;color:var(--parch);border:1px solid var(--rope);border-radius:6px;padding:4px 7px;margin:0 4px}
.wc-steps{margin:8px 0 0;padding-left:20px;display:grid;gap:4px;font-size:13px;color:#e8dcc0}.wc-steps b{color:#fff}

/* your record: points and what they are worth */
.wrec{display:grid;gap:10px}.wrec-head{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.wrec-head i{font-style:normal;background:rgba(201,151,63,.25);border-radius:999px;padding:1px 6px;margin-left:4px;font-size:11px}
.wrew{display:grid;gap:12px;padding:14px 16px;border-radius:12px;background:linear-gradient(135deg,rgba(201,151,63,.22),rgba(201,151,63,.06));border:1px solid rgba(201,151,63,.55);color:#f4ecd8}
.wrew-main{display:flex;gap:14px 28px;align-items:center;flex-wrap:wrap}
.wrew-pts,.wrew-boost{display:flex;flex-direction:column;min-width:0}
.wrew-pts b,.wrew-boost b{font:400 40px/1 "Pirata One","Inter",serif;font-variant-numeric:tabular-nums;color:#f1e3c4}.wrew-boost b{color:#8fe3b0}
.wrew-pts span,.wrew-boost span{font:700 10.5px/1.3 "Inter",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#d9c59a}
.wrew-next{flex:1 1 240px;min-width:0;display:grid;gap:6px;font-size:12.5px;color:#d9d2bf}
.wrew-bar{height:10px;border-radius:5px;background:rgba(0,0,0,.35);overflow:hidden}.wrew-bar span{display:block;height:100%;background:#c9973f}
.wrew-stats{display:flex;gap:8px 22px;flex-wrap:wrap;font-size:13px;color:#d9d2bf;border-top:1px dashed rgba(201,151,63,.4);padding-top:10px}.wrew-stats b{color:#fff;font-variant-numeric:tabular-nums}
.wrules{padding:12px 14px;border-radius:10px;background:rgba(13,22,38,.7);border:1px solid rgba(201,151,63,.3);font-size:13px;color:#e8dcc0}.wrules ul{margin:0 0 8px;padding:0;list-style:none;display:grid;gap:4px}.wrules li b{display:inline-block;min-width:34px;font-variant-numeric:tabular-nums;color:#fff}.wrules p{margin:0;color:#b9c2d6}
.wrec-tbl{overflow-x:auto;border-radius:10px;border:1px solid rgba(201,151,63,.3);background:rgba(13,22,38,.7)}
.wrec-tbl table{width:100%;border-collapse:collapse;font-size:13px;min-width:640px}.wrec-tbl th{font:700 10.5px/1 "Inter",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#d9c59a;text-align:left;padding:10px}
.wrec-tbl td{padding:9px 10px;border-top:1px solid rgba(201,151,63,.18);vertical-align:top;color:#f4ecd8}.wrec-tbl .n{text-align:right;font-variant-numeric:tabular-nums}.wrec-tbl small{display:block;color:#b9c2d6;font-size:11.5px;margin-top:2px}
.wrec-tbl b.up{color:#8fe3b0}.wrec-tbl b.down{color:#ffb3a8}
/* the same strip on the growth page sits on the portal's own surface */
.wrew-wrap .wrew{margin:0;background:linear-gradient(135deg,rgba(201,151,63,.28),rgba(201,151,63,.08)),#101a2b}

/* A graded card is drawn inside a slab: a clear case with a label across the top carrying the grader and the grade.
   A raw card is just the card. The case and label are our own drawing, not any grader's design. */
.wp-slab{position:relative;align-self:center;width:min(100%,158px);margin-top:4px;padding:6px 6px 8px;border-radius:9px;display:grid;gap:5px;
  background:linear-gradient(155deg,rgba(255,255,255,.92),rgba(214,226,238,.7) 45%,rgba(190,206,222,.8));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.95),inset 0 0 0 2.5px rgba(96,116,140,.4),0 4px 9px rgba(0,0,0,.4)}
.wp-slab::after{content:"";position:absolute;inset:0;border-radius:9px;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.55) 0,rgba(255,255,255,0) 28%,rgba(255,255,255,0) 62%,rgba(255,255,255,.28) 100%)}
.wp-slab-label{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px;padding:4px 6px;border-radius:3px;background:#fffdf6;border:2px solid var(--ink);box-shadow:inset 0 3px 0 var(--rope);text-align:left;color:var(--ink)}
.wp-slab-label .l{display:grid;min-width:0}.wp-slab-label b{font:800 11px/1.1 "Inter",sans-serif;letter-spacing:.1em;color:var(--ink);margin-top:2px}
.wp-slab-label i{font:600 8.5px/1.25 "Inter",sans-serif;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink2)}
.wp-slab-label .g{display:grid;justify-items:center;font:800 22px/1 "Inter",sans-serif;font-variant-numeric:tabular-nums;color:var(--ink);padding-left:6px;border-left:1px solid rgba(42,28,16,.25)}
.wp-slab-label .g small{font:700 7px/1 "Inter",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);margin-bottom:1px}
.wp-slab-well{aspect-ratio:5/7;border-radius:4px;background:#12161d;box-shadow:inset 0 0 0 1px rgba(0,0,0,.5),inset 0 2px 6px rgba(0,0,0,.6);display:grid;place-items:center;overflow:hidden;padding:5px}
.wp-slab-well img{display:block;width:100%;height:100%;object-fit:contain;border-radius:3px}
.wp-slab-well span{font:700 9px/1.3 "Inter",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#7d8798}
.wposter:has(.wp-slab) .wp-grade.slab{display:none}   /* the label already says it */
@media (max-width:640px){.wp-slab{width:min(100%,132px)}.wp-slab-label .g{font-size:18px}}

/* a card Rare Candy is paying extra on */
.wposter.boosted{box-shadow:0 6px 14px rgba(0,0,0,.45),inset 0 0 0 2px var(--seal),inset 0 0 26px rgba(120,80,30,.22)}
.wp-boost{display:inline-block;align-self:center;font:800 10px/1 "Inter",sans-serif;font-style:normal;letter-spacing:.1em;text-transform:uppercase;color:#fff8e6;background:var(--seal);padding:4px 8px;border-radius:999px;margin-bottom:4px}
.wp-bounty.up b{color:var(--seal)}.wp-bounty s{color:var(--ink2);opacity:.8}
