/* Not Monopoly Deal: No Mercy. Card faces, IOU chips and the table surface, shared by the
   TV and the phones. Card sizing follows shared/cards.css: set --cw on the card or an
   ancestor; inside the card, everything is in container units. */

/* ---- No Mercy action cards: the classic ring, a meaner kicker, line-drawn icons ---- */
.k-nmact .pc-kicker { color: #b4121b; letter-spacing: .2em; }
.k-nmact .pc-ring { background: radial-gradient(circle at 50% 35%, #fffaf0, #e6dcc6); }
.k-nmact .pc-icon { width: 30cqw; height: 30cqw; color: var(--ring); font-size: 0; }
.k-nmact .pc-icon svg { width: 100%; height: 100%; display: block; }
.k-nmact .pc-atitle { font-size: 7.6cqw; line-height: .98; max-width: 56cqw; }
.k-nmact.a-gate .pc-atitle, .k-nmact.a-river .pc-atitle { font-size: 6.6cqw; }
.k-nmact .pc-text { font-size: 5.1cqw; line-height: 1.12; bottom: 5cqw; }
.pcard.k-nmact::before, .pcard.k-nmrent.dbl::before { content: ''; position: absolute; right: 0; top: 0; width: 15cqw; height: 15cqw; background: linear-gradient(225deg, #b4121b 0 50%, transparent 50%); pointer-events: none; }

/* rent and double rent */
.k-nmrent .pc-kicker { color: #5b5240; }
.k-nmrent.dbl .pc-kicker { color: #b4121b; }
.k-nmrent .pc-hub { flex-direction: column; font-size: 8cqw; }
.k-nmrent.dbl .pc-hub { background: #1b1f2a; color: #fff; font-size: 6.6cqw; box-shadow: 0 0 0 1.2cqw #b4121b; }
.k-nmrent.dbl .pc-hub b { font-size: 15cqw; line-height: .9; color: #ff4b55; }
.k-nmrent .pc-text { font-size: 5.8cqw; }

/* the reference card */
.k-nmref { padding: 8cqw 7cqw; }
.k-nmref .pc-kicker { margin-top: 2cqw; color: #b4121b; }
.k-nmref ol { margin: 5cqw 0 0; padding-left: 9cqw; font-size: 7cqw; font-weight: 800; line-height: 1.3; }

/* the back: black and red, a NOT DEAL disc and a NO MERCY stamp */
.k-nmback { background: #120c0d; box-shadow: 0 calc(var(--cw, 100px) * .03) calc(var(--cw, 100px) * .1) rgba(0,0,0,.5); }
.k-nmback .pc-backin { position: absolute; inset: 5cqw; border-radius: 4cqw; border: 1.2cqw solid #b4121b; background: repeating-linear-gradient(-45deg, #1d1214 0 5cqw, #120c0d 5cqw 10cqw); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.k-nmback .pc-logo { background: #f2ead8; color: #120c0d; font-weight: 900; font-size: 9cqw; line-height: .95; text-align: center; padding: 4cqw 6cqw; border-radius: 4cqw; transform: rotate(-12deg); letter-spacing: .06em; box-shadow: 0 1cqw 0 rgba(0,0,0,.4); }
.k-nmback .pc-logo b { font-size: 14cqw; }
.k-nmback .pc-stamp { position: absolute; bottom: 12cqw; left: 50%; transform: translateX(-50%) rotate(-8deg); border: 1.4cqw solid #ff2b3a; color: #ff2b3a; font-weight: 900; font-size: 8.5cqw; letter-spacing: .08em; padding: .5cqw 3cqw; border-radius: 2cqw; white-space: nowrap; font-family: "Futura", "Avenir Next", Arial, sans-serif; }

/* ---- IOU chips: poker chips in the five debt-chip colours ---- */
.nm-chip { --chip: #d61f2c; --cs: 34px; position: relative; display: inline-flex; align-items: center; justify-content: center; width: var(--cs); height: var(--cs); border-radius: 50%; flex: none;
  background: radial-gradient(circle, var(--chip) 0 52%, transparent 53%), repeating-conic-gradient(var(--chip) 0 22.5deg, #fff 22.5deg 45deg);
  box-shadow: 0 0 0 calc(var(--cs) * .06) var(--chip), 0 calc(var(--cs) * .08) calc(var(--cs) * .18) rgba(0,0,0,.45); }
.nm-chip i { font-style: normal; font-weight: 900; font-size: calc(var(--cs) * .27); letter-spacing: .02em; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.6); font-family: "Futura", "Avenir Next", Arial, sans-serif; }
.nm-chip.out { background: transparent; box-shadow: inset 0 0 0 calc(var(--cs) * .07) color-mix(in srgb, var(--chip) 55%, transparent); border: calc(var(--cs) * .06) dashed color-mix(in srgb, var(--chip) 70%, transparent); }
.nm-chip.out i { color: color-mix(in srgb, var(--chip) 80%, #fff); text-shadow: none; opacity: .85; }
.nm-chip.held { animation: nm-chipin .5s cubic-bezier(.2,1.4,.4,1) both; }
@keyframes nm-chipin { from { transform: translateY(-30px) rotate(-90deg) scale(.4); opacity: 0; } }
[data-theme="light"] .nm-chip.out i { color: color-mix(in srgb, var(--chip) 85%, #000); }

/* ---- the table: a property board after dark, edged with hazard tape ---- */
.tbl-nomercy {
  --tbl-edge: #0c0809; --tbl-rim: #8f1219; --tbl-glow: rgba(255,60,70,.07);
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.022) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.022) 0 1px, transparent 1px 64px),
    radial-gradient(ellipse 70% 60% at 50% 50%, #1d2a25 0%, #141d1a 60%, #0f1513 100%),
    #111816;
}
[data-theme="light"] .tbl-nomercy {
  --tbl-edge: #f4ede1; --tbl-rim: #a3121b; --tbl-glow: rgba(255,255,255,.3);
  background:
    repeating-linear-gradient(0deg, rgba(120,20,25,.045) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(90deg, rgba(120,20,25,.045) 0 1px, transparent 1px 64px),
    radial-gradient(ellipse 70% 60% at 50% 50%, #f3eee4 0%, #ebe3d5 60%, #e2d8c6 100%),
    #ebe3d5;
}
.nm-felt.tbl-nomercy::after {
  content: ""; position: absolute; inset: 11px; border-radius: 26px; pointer-events: none; z-index: 0; opacity: .95;
  --tape: repeating-linear-gradient(-45deg, #b4121b 0 16px, #141012 16px 32px);
  background: var(--tape) top left / 100% 12px no-repeat, var(--tape) bottom left / 100% 12px no-repeat, var(--tape) top left / 12px 100% no-repeat, var(--tape) top right / 12px 100% no-repeat;
}
[data-theme="light"] .nm-felt.tbl-nomercy::after { --tape: repeating-linear-gradient(-45deg, #c0121c 0 16px, #1d1416 16px 32px); opacity: .9; }