/* Coin marketplace. Tokens come from css/redesign.css (--rd-*). Everything is prefixed with cm-. */
.cm-page{--cm-line:var(--rd-border,#1e2640);--cm-line2:var(--rd-border-2,#252d45)}
.cm-page a{text-decoration:none}
.cm-page>*{min-width:0;max-width:100%}
.cm-muted{color:var(--rd-muted,#8a92a8)}
.cm-faint{color:var(--rd-faint,#555e78)}
.cm-small{font-size:13px}
.cm-block{display:block}
.cm-card{background:linear-gradient(180deg,rgba(31,38,52,.94),rgba(15,19,28,.98));border:1px solid rgba(255,255,255,.1);border-radius:10px;color:var(--rd-text,#e8eaf2)}
.cm-pad{padding:18px}
.cm-h2{font-size:20px;margin:0 0 12px}
.cm-sec{margin-top:18px}

.cm-price{font-family:var(--rd-font-head,inherit);font-weight:800;white-space:nowrap}
.cm-price i{color:var(--rd-gold,#f5c842);font-size:.9em;margin-left:3px}
.cm-q{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--rd-surface-2,#161c2e);border:1px solid var(--cm-line2);color:var(--rd-muted);font-size:11px;font-weight:700;font-style:normal;margin-left:5px;cursor:help}

.cm-btn,.cm-btn:hover{text-decoration:none!important}
.cm-stat b .cm-price{font-size:inherit;display:inline;margin:0;color:inherit}
.cm-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:10px;border:1px solid var(--cm-line2);background:var(--rd-surface-2,#161c2e);color:var(--rd-text,#e8eaf2);font-weight:700;font-size:14px;white-space:nowrap;cursor:pointer;transition:.15s}
.cm-btn:hover{border-color:var(--rd-accent,#e8762a);color:var(--rd-text,#e8eaf2)}
.cm-btn:disabled{opacity:.55;cursor:default}
.cm-btn-main{background:linear-gradient(135deg,var(--rd-accent,#e8762a),var(--rd-accent-2,#f0952a));border-color:transparent;color:#fff;box-shadow:0 8px 24px var(--rd-accent-glow,rgba(232,118,42,.22))}
.cm-btn-main:hover{color:#fff;filter:brightness(1.08)}
.cm-btn-big{min-height:56px;font-size:17px;padding:0 28px}
.cm-btn-ghost{background:transparent}
.cm-btn-sm{padding:0 14px}
.cm-btn-off,.coin-inventory-actions .cm-btn-off{background:var(--rd-surface,#111520);color:var(--rd-faint,#555e78);cursor:default;border:1px solid var(--cm-line);white-space:normal;line-height:1.2}

/* Pictures and previews */
.cm-img{position:relative;aspect-ratio:1/1;border-radius:10px;overflow:hidden;background:radial-gradient(circle at 50% 40%,#1d2640,#0c0f18);display:grid;place-items:center}
.cm-img>img{width:100%;height:100%;object-fit:cover}
.cm-img .coin-media{width:100%;height:100%}
.cm-img-big{max-width:420px;width:100%}
.cm-thumb{width:64px;height:64px;aspect-ratio:auto;flex:none}
.cm-tag{position:absolute;left:8px;top:8px;background:rgba(7,9,14,.8);border:1px solid var(--cm-line2);border-radius:999px;font-size:11px;font-weight:700;padding:3px 9px;color:var(--rd-muted)}
.cm-tag-on{color:#041c19;background:var(--rd-teal,#22c9b7);border-color:var(--rd-teal,#22c9b7)}
.cm-pic{display:block;max-width:100%}
.cm-pic-stub{display:grid;place-items:center;aspect-ratio:1/1;width:200px;margin:0 auto 14px;border-radius:16px;background:radial-gradient(circle at 50% 40%,#1d2640,#0c0f18);border:1px dashed var(--cm-line2);color:var(--rd-faint);font-size:56px}

/* Hero */
.cm-hero{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;position:relative;overflow:hidden;border-radius:14px;padding:28px 32px;margin-bottom:18px;border:1px solid var(--cm-line);background:linear-gradient(90deg,rgba(7,9,14,.95) 38%,rgba(7,9,14,.3)),repeating-linear-gradient(45deg,#121827,#121827 14px,#161d30 14px,#161d30 28px)}
.cm-hero>*{position:relative;z-index:1}
.cm-hero h1{font-size:34px;margin:0 0 6px}
.cm-hero .cm-hero-pic{position:absolute;inset:0;height:100%;width:100%;max-width:none;object-fit:cover;z-index:0;opacity:.75;pointer-events:none}
.cm-hero .cm-hero-pic img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
/* Desktop artwork has 75px transparent gutters on each side of its 2400px canvas. */
@media (min-width:601px){
  .cm-hero picture.cm-hero-pic img{transform:scaleX(1.066667)}
}
.cm-hero:has(picture.cm-hero-pic){min-height:280px}
.cm-page .bi-coin::before,.cm-promo .bi-coin::before{content:"";display:inline-block;width:1em;height:1em;background:url('/static/images/market/coin.webp') center/contain no-repeat;vertical-align:-.1em}
.cm-empty>.cm-pic:not(.cm-pic-stub){width:230px;height:230px;object-fit:contain;margin:0 auto 14px}
.cm-hero .cm-pic-stub{display:none}
.cm-bal{display:inline-flex;align-items:center;gap:8px;background:rgba(0,0,0,.45);border:1px solid var(--cm-line2);border-radius:999px;padding:8px 16px;font-weight:800;font-size:18px;font-family:var(--rd-font-head,inherit)}
.cm-bal i{color:var(--rd-gold,#f5c842)}
.cm-hero-acts{display:flex;flex-direction:column;gap:12px;align-items:flex-end}

/* Search, chips, sorting */
.cm-search{position:relative;display:flex;align-items:center;gap:10px;background:var(--rd-surface,#111520);border:2px solid var(--cm-line2);border-radius:14px;padding:0 16px;min-height:56px;margin-bottom:12px}
.cm-search:focus-within{border-color:var(--rd-accent,#e8762a)}
.cm-search input{flex:1;background:none;border:0;outline:0;color:var(--rd-text,#e8eaf2);font-size:17px;min-width:0;min-height:52px}
.cm-suggest{position:absolute;left:-2px;right:-2px;top:calc(100% + 6px);z-index:20;background:var(--rd-surface,#111520);border:1px solid var(--cm-line2);border-radius:12px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.5)}
.cm-suggest a{display:flex;align-items:center;gap:12px;padding:8px 14px;min-height:56px;color:var(--rd-text)}
.cm-suggest a+a{border-top:1px solid var(--cm-line)}
.cm-suggest a:hover{background:var(--rd-surface-2,#161c2e)}
.cm-suggest .cm-img{width:40px;height:40px;flex:none;border-radius:8px}
.cm-suggest b{flex:1}
.cm-chips{display:flex;gap:8px;overflow-x:auto;margin-bottom:12px;scrollbar-width:none;padding-bottom:2px}
.cm-chips::-webkit-scrollbar{display:none}
.cm-chip{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:0 16px;min-height:48px;border-radius:999px;background:var(--rd-surface,#111520);border:1px solid var(--cm-line);font-weight:700;color:var(--rd-text)}
.cm-chip i{font-size:18px}
.cm-chip.on{background:var(--rd-teal-soft,rgba(34,201,183,.12));border-color:var(--rd-teal,#22c9b7);color:var(--rd-teal,#22c9b7)}
.cm-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.cm-select{position:relative;display:inline-flex;align-items:center;gap:8px;background:var(--rd-surface,#111520);border:1px solid var(--cm-line2);border-radius:10px;min-height:44px;padding:0 10px 0 14px;font-weight:600}
.cm-select select{background:transparent;border:0;color:var(--rd-text);font-weight:600;min-height:42px;outline:0;padding-right:6px}
.cm-select select option{background:#111520}
.cm-switch{display:inline-flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;margin:0}
.cm-switch input[type=checkbox]{position:absolute;opacity:0;width:1px;height:1px}
.cm-switch u{width:42px;height:24px;border-radius:99px;background:var(--cm-line2);position:relative;display:inline-block;transition:.15s}
.cm-switch u::after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.15s}
.cm-switch input:checked+u{background:var(--rd-teal,#22c9b7)}
.cm-switch input:checked+u::after{left:21px}
.cm-switch input:focus-visible+u{outline:2px solid var(--rd-accent)}

/* Grid and tiles */
.cm-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start}
.cm-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.cm-tile{min-width:0;padding:12px;display:flex;flex-direction:column;gap:10px;transition:.15s;color:var(--rd-text)}
.cm-tile:hover{border-color:rgba(255,193,7,.55);transform:translateY(-2px);color:var(--rd-text)}
.cm-name{font-weight:700;font-size:15px;line-height:1.25;min-height:2.5em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cm-tile-price{font-size:17px;min-height:1.4em}
.cm-tile-price small{font-size:12px;color:var(--rd-muted);font-weight:600;margin-right:4px}
.cm-tile-price.cm-muted{font-size:13px;font-weight:600;line-height:1.4}
.cm-tile .cm-faint{font-size:12px}
.cm-feed h3{font-size:16px;margin:0 0 12px}
.cm-feed-row{display:flex;gap:10px;align-items:center;padding:9px 0;border-top:1px solid var(--cm-line);font-size:13px;color:var(--rd-text)}
.cm-feed h3+.cm-feed-row{border-top:0}
.cm-feed-img{width:44px;height:44px;border-radius:8px;overflow:hidden;flex:none;display:grid;place-items:center;background:#0c0f18}
.cm-feed-img img{width:100%;height:100%;object-fit:cover}
.cm-more{display:flex;justify-content:center;margin-top:18px}
.cm-empty{text-align:center;padding:50px 20px;max-width:560px;margin:0 auto}
.cm-empty h2{font-size:22px;margin:0 0 6px}
.cm-empty p{margin:0 0 18px;color:var(--rd-muted)}
.cm-empty-inline{padding:20px;max-width:none}

/* Item page */
.cm-back{display:inline-block;margin-bottom:14px;color:var(--rd-muted);font-size:14px}
.cm-itop{display:grid;grid-template-columns:420px 1fr;gap:26px;margin-bottom:18px}
.cm-itop h1{font-size:30px;margin:6px 0}
.cm-pills{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.cm-pill{display:inline-block;font-size:12px;font-weight:700;border-radius:999px;padding:4px 11px;background:var(--rd-surface-2,#161c2e);border:1px solid var(--cm-line2);color:var(--rd-muted)}
.cm-buy{padding:20px;margin-bottom:14px}
.cm-low{font-size:14px;color:var(--rd-muted);margin-bottom:6px}
.cm-big-price{font-size:40px;margin-bottom:14px}
.cm-row2{display:flex;gap:10px;flex-wrap:wrap}
.cm-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.cm-stat{padding:14px;text-align:center}
.cm-stat span{display:block;font-size:12px;color:var(--rd-muted);margin-bottom:4px}
.cm-stat b{font-family:var(--rd-font-head,inherit);font-size:22px}
.cm-two{display:grid;grid-template-columns:1.5fr 1fr;gap:18px;align-items:start}
.cm-seg{display:inline-flex;background:var(--rd-surface,#111520);border:1px solid var(--cm-line);border-radius:10px;padding:3px;margin-bottom:12px}
.cm-seg button{background:none;border:0;min-height:40px;padding:0 16px;border-radius:8px;color:var(--rd-muted);font-weight:700;cursor:pointer}
.cm-seg button.on{background:var(--rd-surface-2,#161c2e);color:var(--rd-text)}
.cm-chartbox{height:260px;position:relative}
.cm-chart-empty{position:absolute;inset:0;display:grid;place-items:center}
.cm-off-row{display:grid;grid-template-columns:44px 1fr auto auto;gap:14px;align-items:center;padding:10px 0;border-top:1px solid var(--cm-line)}
.cm-off-row[hidden]{display:none}
.cm-av{width:44px;height:44px;border-radius:50%;object-fit:cover;background:var(--rd-surface-2)}
.cm-nick{font-weight:700}
.cm-rowc{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--cm-line);font-size:14px}
.cm-h2+.cm-rowc,.cm-h2+.cm-muted{border-top:0}

/* My offers */
.cm-chead{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:16px}
.cm-chead h1{font-size:28px;margin:0}
.cm-tabs{display:flex;gap:6px;margin-bottom:14px;overflow-x:auto}
.cm-tabs a{padding:0 18px;min-height:44px;display:inline-flex;align-items:center;border-radius:10px;background:var(--rd-surface,#111520);border:1px solid var(--cm-line);font-weight:700;color:var(--rd-muted);white-space:nowrap}
.cm-tabs a.on{border-color:var(--rd-accent,#e8762a);color:var(--rd-text)}
.cm-sum{padding:16px 20px;margin-bottom:14px;display:flex;align-items:center;gap:14px;font-size:16px}
.cm-sum>i{font-size:28px;color:var(--rd-gold,#f5c842)}
.cm-mrow{display:grid;grid-template-columns:64px 1fr auto auto;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--cm-line)}
.cm-mrow:first-child{border-top:0}
.cm-lab{display:inline-block;font-size:12px;font-weight:800;border-radius:999px;padding:3px 10px}
.cm-lab-g{background:rgba(46,201,119,.15);color:var(--rd-green,#2ec977)}
.cm-lab-b{background:rgba(90,150,255,.16);color:#7fb0ff}
.cm-lab-s{background:rgba(138,146,168,.18);color:var(--rd-muted)}
.cm-lab-r{background:rgba(232,66,66,.16);color:var(--rd-red,#e84242)}

/* Entry points */
.cm-promo{display:grid;grid-template-columns:160px 1fr 300px;gap:20px;align-items:center;max-height:160px;padding:14px 22px;margin-bottom:22px;border-color:rgba(232,118,42,.4);background:linear-gradient(100deg,rgba(232,118,42,.14),rgba(17,21,32,.96) 55%)}
.cm-promo .cm-pic{margin:0;width:100%;max-height:120px;object-fit:contain}
.cm-promo .cm-pic-stub{width:120px;font-size:40px}
.cm-promo h2{font-size:22px;margin:0 0 4px}
.cm-promo p{margin:0 0 10px}
.cm-mini{border-left:1px solid var(--cm-line);padding-left:18px;font-size:13px;display:flex;flex-direction:column;gap:7px}
.cm-mini>b{font-size:11px;letter-spacing:.05em;text-transform:uppercase}
.cm-stamp{position:absolute;left:8px;top:8px;background:var(--rd-accent,#e8762a);color:#fff;font-size:11px;font-weight:800;border-radius:999px;padding:3px 10px;box-shadow:0 4px 12px var(--rd-accent-glow);z-index:2}
.coin-inventory-image{position:relative}
.coin-inventory-actions .btn{white-space:normal}
.cm-case-link{display:inline-block;color:var(--rd-teal,#22c9b7);font-weight:700;margin-top:12px;min-height:44px;line-height:44px}
.cm-case-link[hidden]{display:none}

/* Windows */
.cm-dim{position:fixed;inset:0;z-index:1080;background:rgba(0,0,0,.62);display:flex;justify-content:center;align-items:flex-start;padding:34px 16px;overflow-y:auto}
.cm-modal{width:100%;max-width:480px;background:var(--rd-surface,#111520);border:1px solid var(--cm-line2);border-radius:16px;padding:22px;position:relative;box-shadow:0 30px 80px rgba(0,0,0,.6);color:var(--rd-text);margin:auto}
.cm-x{position:absolute;right:12px;top:10px;width:44px;height:44px;border:0;background:none;color:var(--rd-muted);font-size:20px;cursor:pointer}
.cm-modal h2{font-size:21px;margin:0 36px 14px 0}
.cm-mi{display:flex;gap:14px;align-items:center;margin-bottom:16px}
.cm-mi .cm-img{width:104px;flex:none}
.cm-quick{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.cm-quick .cm-btn{flex:1;min-width:150px;font-size:13px;padding:0 10px}
.cm-pf{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.cm-pf .cm-btn{width:52px;padding:0;font-size:22px}
.cm-pf input{flex:1;min-width:0;min-height:56px;border-radius:12px;background:var(--rd-bg,#07090e);border:2px solid var(--rd-accent,#e8762a);color:var(--rd-text);text-align:center;font-family:var(--rd-font-head,inherit);font-weight:800;font-size:26px;outline:0}
.cm-pf input.bad{border-color:var(--rd-red,#e84242)}
.cm-get{font-size:15px;margin-bottom:6px}
.cm-get b{color:var(--rd-green,#2ec977)}
.cm-bounds{font-size:13px;color:var(--rd-faint);margin-bottom:16px}
.cm-bounds.bad{color:var(--rd-red,#e84242)}
.cm-soft{background:var(--rd-teal-soft,rgba(34,201,183,.12));border:1px solid rgba(34,201,183,.35);border-radius:10px;padding:10px 12px;font-size:13px;color:var(--rd-teal);margin-bottom:14px}
.cm-note{background:rgba(232,66,66,.12);border:1px solid rgba(232,66,66,.35);border-radius:10px;padding:10px 12px;font-size:14px;margin-bottom:14px}
.cm-mbtns{display:flex;gap:10px}
.cm-mbtns .cm-btn{flex:1}
.cm-center{text-align:center}
.cm-ok{position:relative;width:150px;height:150px;margin:0 auto 10px;display:grid;place-items:center}
.cm-ok .cm-pic{width:100%}
.cm-ok .cm-pic-stub{width:130px;font-size:56px;color:var(--rd-green,#2ec977)}
.cm-pickrow{display:flex;gap:12px;align-items:center;padding:10px;border:1px solid var(--cm-line);border-radius:12px;margin-bottom:8px;cursor:pointer;background:var(--rd-surface-2);width:100%;text-align:left;color:var(--rd-text)}
.cm-pickrow:hover{border-color:var(--rd-accent)}
.cm-pickrow .cm-img{width:64px;flex:none}
.cm-pickrow small{display:block;color:var(--rd-muted)}
.cm-toast{position:fixed;right:20px;bottom:20px;z-index:1100;background:var(--rd-surface-2,#161c2e);border:1px solid var(--rd-teal,#22c9b7);border-radius:12px;padding:12px 16px;display:flex;gap:10px;align-items:center;max-width:340px;font-size:14px;color:var(--rd-text);animation:cm-in .25s ease-out}
.cm-toast i{color:var(--rd-green);font-size:20px}
.cm-toast.bad{border-color:var(--rd-red)}
.cm-toast.bad i{color:var(--rd-red)}
@keyframes cm-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.cm-fly{position:fixed;z-index:1200;font-size:22px;color:var(--rd-gold,#f5c842);pointer-events:none;animation:cm-fly .9s ease-in forwards}
@keyframes cm-fly{to{transform:translate(var(--dx),var(--dy)) scale(.4);opacity:0}}
/* buy orders (M3) */
.cm-sellnow{width:100%;margin:2px 0 12px;background:var(--rd-gold,#f5c842);color:#1a1405;border-color:transparent}
.cm-sellnow:disabled{opacity:.6}
[data-cm-book] .cm-rowc:first-of-type{border-top:0}

@media (prefers-reduced-motion:reduce){.cm-fly,.cm-toast{animation:none}}

@media (max-width:991px){
  .cm-layout,.cm-two{grid-template-columns:minmax(0,1fr)}
  .cm-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:640px){
  .cm-hero{grid-template-columns:1fr;padding:18px;background:linear-gradient(180deg,rgba(7,9,14,.5),rgba(7,9,14,.95)),repeating-linear-gradient(45deg,#121827,#121827 14px,#161d30 14px,#161d30 28px)}
  .cm-hero h1{font-size:25px}
  .cm-hero:has(picture.cm-hero-pic){min-height:370px;align-content:space-between}
  .cm-hero .cm-hero-pic{opacity:.6}
  .cm-hero-acts{align-items:stretch}
  .cm-hero-acts .cm-btn{width:100%}
  .cm-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .cm-tile{padding:8px}
  .cm-name{font-size:13px}
  .cm-tile-price{font-size:15px}
  .cm-itop{grid-template-columns:1fr}
  .cm-itop h1{font-size:23px}
  .cm-big-price{font-size:34px}
  .cm-buy .cm-btn-big{width:100%}
  .cm-row2 .cm-btn{flex:1}
  .cm-stat{padding:10px 6px}
  .cm-stat b{font-size:17px}
  .cm-stat span{font-size:11px}
  .cm-off-row{grid-template-columns:40px 1fr auto;row-gap:8px}
  .cm-off-row .cm-btn{grid-column:1/-1}
  .cm-av{width:40px;height:40px}
  .cm-mrow{grid-template-columns:56px 1fr;row-gap:8px}
  .cm-thumb{width:56px;height:56px}
  .cm-mrow>:nth-child(n+3){grid-column:1/-1}
  .cm-mrow .cm-btn{width:100%}
  .cm-promo{grid-template-columns:1fr;max-height:none;padding:14px}
  .cm-promo .cm-pic{margin:0 auto;max-height:120px}
  .cm-promo .cm-btn{width:100%}
  .cm-mini{border-left:0;padding-left:0;border-top:1px solid var(--cm-line);padding-top:10px}
  .cm-modal{padding:18px}
  .cm-dim{padding:16px 10px}
  .cm-mbtns{flex-direction:column-reverse}
  .cm-quick .cm-btn{min-width:100%}
  .cm-chead{flex-direction:column;align-items:stretch}
  .cm-toast{left:12px;right:12px;bottom:12px;max-width:none}
  .cm-rowc{flex-wrap:wrap}
  .cm-hist{align-items:flex-start}
}
