.slot-card{position:relative;width:100%;height:auto;aspect-ratio:150/132;box-sizing:border-box;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--accent-soft, #8dcff1) 10%,transparent);border-radius:6px;box-shadow:0 1px 4px #0c0c0d0d;overflow:hidden;transition:background .1s}.slot-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:6px;box-shadow:inset 0 0 0 1px var(--accent-soft, #8dcff1);pointer-events:none;z-index:1}.slot-card.side-opp{background:color-mix(in srgb,var(--accent-second, #6b5ea7) 3%,transparent)}.slot-card.side-opp:after{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent-second, #6b5ea7) 30%,transparent)}.slot-card.highlighted,.slot-card.highlighted.filled{background:color-mix(in srgb,var(--accent-soft, #8dcff1) 18%,transparent)}.slot-card.highlighted:after{box-shadow:inset 0 0 0 3px var(--accent, #885ca4)}.slot-card.highlighted.side-opp,.slot-card.highlighted.filled.side-opp{background:color-mix(in srgb,var(--accent-second, #6b5ea7) 10%,transparent)}.slot-card.highlighted.side-opp:after{box-shadow:inset 0 0 0 3px var(--accent, #885ca4)}.slot-pick{position:absolute;top:0;right:0;bottom:0;left:0;background:none;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:inherit}.slot-empty{color:var(--color-secondary)}.slot-add{display:block;flex-shrink:0}@media(hover:hover){.slot-card .slot-pick:hover{background:color-mix(in srgb,var(--accent-soft, #8dcff1) 18%,transparent)}.slot-card.side-opp .slot-pick:hover{background:color-mix(in srgb,var(--accent-second, #6b5ea7) 10%,transparent)}}.slot-pick:active{opacity:.7}.slot-sprite{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);max-height:96px;width:auto;height:auto;pointer-events:none;image-rendering:pixelated}.slot-clear{position:absolute;top:6px;right:6px;z-index:2;background:none;border:none;color:var(--color-secondary);cursor:pointer;padding:0;line-height:0;min-height:unset;display:flex;align-items:center;justify-content:center;transition:--del-sq-bg .15s}@media(hover:hover){.slot-clear:hover{--del-sq-bg: color-mix(in srgb, var(--color-secondary) 12%, var(--color-bg))}}.slot-clear:active{--del-sq-bg: color-mix(in srgb, var(--color-secondary) 22%, var(--color-bg))}.slot-clear:hover,.slot-clear:active{opacity:1}